CSS3.0の各種修飾 - 色表示
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=SJIS" /> <title> 色表示 </title> <style type="text/css"> div>div{ width: 400px; height: 40px; } </style> </head> <body> <script type="text/javascript"> for (var i = 0; i < 110 ; i++) { document.write("テスト文字"); } </script> <div style="position:absolute;top:0px"> <div style="background-color:gray;">background-color:gray</div> <div style="background-color:#aaa;">background-color:#aaa;</div> <div style="background-color:#ffff00;">background-color:#ffff00;</div> <div style="background-color:rgb(255, 0 , 255);"> background-color:rgb(255, 0 , 255);</div> <div style="background-color:hsl(120, 80%, 50%);"> background-color:hsl(120, 80%, 50%);</div> <div style="background-color:rgba(255, 0 , 255 , 0.5);"></div> <div style="background-color:hsla(120, 80%, 50% , 0.5);"></div> </div> </body> </html>
※rgba(255, 0 , 255 , 0.5)
hsla(120, 80%, 50% , 0.5)は半透明を設定しているので、文字が見えるね。