【CSS3】颜色表示方式

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="utf-8">
 5     <title></title>    
 6     <!-- <link rel="stylesheet" type="text/css" href="style.css"> -->
 7     <style type="text/css">
 8         body{background: url(img/花1.jpg);}
 9         div{width: 100%;height: 50px}
10         #div1{background: #0f0}
11         #div2{background: rgb(255,0,0);}
12         #div3{background: rgb(0%,0%,100%);}
13         #div4{background: rgba(255,0,0,0.5);}
14         #div5{background: hsla(120,50%,50%,1);}
15     </style>
16     <!--16进制表示颜色时两两相同时可只写一位-->
17     <!--HSL模式:H表示色调(0或360表示红色,120表示绿色,240表示蓝色,取值范围0-360);S表示饱和度,取值范围0.0%-100.0%;L表示亮度,取值范围0.0%-100.0%;
18     HSLA在HSL模式上加了Alpha透明度,类似RGB和RBGA-->
19 </head>
20 <body>
21     <div id="div1"></div>
22     <div id="div2"></div>
23     <div id="div3"></div>
24     <div id="div4"></div>
25     <div id="div5"></div>
26 </body>
27 </html>

 

posted @ 2017-04-23 12:53  xiongjiawei  阅读(516)  评论(0编辑  收藏  举报