css中颜色有几种表达方式?

css中颜色有几种表达方式?下面本篇文章给大家介绍一下css中表达颜色的几种方式。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

CSS中几种颜色的表示方法

1、用颜色名表示

如:white、red、greenyellow、gold等。

2、用十六进制的颜色值表示(红、绿、蓝)

#FF0000或者#F00

3、用rgb(r,g,b)函数表示

如:rgb(255,255,0)

4、用hsl(Hue,Saturation,Lightness)函数表示(色调、饱和度、亮度)

如:hsl(120,100%,100%),色调0代表红色,120代表绿色,240代表

蓝色

5、用rgba(r,g,b,a)函数表示

其中a表示的是改颜色的透明度,取值范围是0~1,其中0代表完全透明。

6、用hsla(Hue,Saturation,Lightness,alpha)函数表示

色调、饱和度、亮度、透明度

举个例子吧

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=GBK" />
        <title>颜色表示方式</title>
        <style type="text/css">
            div>div{
                width:400px;
                height:40px;
            }
        </style>
    </head>
    <body>
        <script type="text/javascript">
            for(var i=0;i<1100;i++){
                document.write("测试文字");
            }
        </script>
        <div style="position:absolute;top:0px">
            <div style="background-color:gray;">background-color:gray</div>
            <div style="background-color:#F00;">background-color:#F00</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);">background-color:rgba(255,0,255,0.5)</div>
            <div style="background-color:hsla(120,80%,50%,0.5);">background-color:hsla(120,80%,50%,0.5)</div>
        </div>
    </body>
</html>

1.jpg

更多web前端相关知识,请查阅 HTML中文网 !!

以上就是css中颜色有几种表达方式?的详细内容,更多请关注html中文网其它相关文章!

赞(0) 打赏
未经允许不得转载:html中文网首页 » CSS3 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏