【CSS3】颜色表示方式

时间：2024-06-02 15:08:14
 <!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8">

     <title></title>

     <!-- <link rel="stylesheet" type="text/css" href="style.css"> -->

     <style type="text/css">

         body{background: url(img/花1.jpg);}

         div{width: 100%;height: 50px}

         #div1{background: #0f0}

         #div2{background: rgb(255,0,0);}

         #div3{background: rgb(0%,0%,100%);}

         #div4{background: rgba(255,0,0,0.5);}

         #div5{background: hsla(120,50%,50%,1);}

     </style>

     <!--16进制表示颜色时两两相同时可只写一位-->

     <!--HSL模式：H表示色调(0或360表示红色，120表示绿色，240表示蓝色，取值范围0-360)；S表示饱和度，取值范围0.0%-100.0%；L表示亮度，取值范围0.0%-100.0%；

     HSLA在HSL模式上加了Alpha透明度，类似RGB和RBGA-->

 </head>

 <body>

     <div id="div1"></div>

     <div id="div2"></div>

     <div id="div3"></div>

     <div id="div4"></div>

     <div id="div5"></div>

 </body>

 </html>

相关文章