资讯专栏INFORMATION COLUMN

css中的颜色

kelvinlee / 2297人阅读

摘要:我常用的是里面的自带的画图工具里面的颜色表设置颜色的几种方式颜色名值十六进制表示颜色对照表地址

我常用的是win10里面的自带的3D画图工具里面的颜色表

 

CSS 设置颜色的几种方式:

1.颜色名

2.rgb值

3十六进制表示

4. HSL color values

CSS3 adds numerical hue-saturation-lightness (HSL) colors as a complement to numerical RGB colors. It has been observed that RGB colors have the following limitations:

  • RGB is hardware-oriented: it reflects the use of CRTs.
  • RGB is non-intuitive. People can learn how to use RGB, but actually by internalizing how to translate hue, saturation and lightness, or something similar, to RGB.

There are several other color schemes possible. Some advantages of HSL are that it is symmetrical to lightness and darkness (which is not the case with HSV for example), and it is trivial to convert HSL to RGB.

HSL colors are encoding as a triple (hue, saturation, lightness). Hue is represented as an angle of the color circle (i.e. the rainbow represented in a circle). This angle is so typically measured in degrees that the unit is implicit in CSS; syntactically, only a is given. By definition red=0=360, and the other colors are spread around the circle, so green=120, blue=240, etc. As an angle, it implicitly wraps around such that -120=240 and 480=120. One way an implementation could normalize such an angle x to the range [0,360) (i.e. zero degrees, inclusive, to 360 degrees, exclusive) is to compute (((x mod 360) + 360) mod 360). Saturation and lightness are represented as percentages. 100% is full saturation, and 0% is a shade of gray. 0% lightness is black, 100% lightness is white, and 50% lightness is “normal”.

 

 

 

颜色对照表地址:http://tool.oschina.net/commons?type=3

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/1389.html

相关文章

  • webpack插件实现自动抽取css中的主题色样式,并一键动态切换主题色(element-ui)

    摘要:项目项目中用了,有切换主题色的需要。但官方的方式,有几个问题需要下载整个的样式,并替换其中的样式颜色。代码已开源在,欢迎并提交其他库的主题色获取方法。 项目项目中用了element-ui,有切换主题色的需要。但官方的方式,有几个问题:1、需要下载整个element-ui的样式css,并替换其中的css样式颜色。文件较大,下载慢且影响性能。2、只能替换element-ui本身的颜色样式,...

    dcr309duan 评论0 收藏0
  • [译]HTML&CSS Lesson3: 了解CSS

    摘要:我们会在组合选择器中来了解为什么权重值要加连字符。组合选择器中的权重值会分别对不同类型的选择器进行计数。对比两组选择器,第二组选择器有两个选择器,拥有更高的权重值。 CSS是一门复杂的语言,拥有相当的大能力。 它我们允许为页面添加布局和设计,允许多个元素甚至多个页面共享样式。在我们有能力解锁所有功能之前,我们必须先充分理解它的基础点。 首先,我们要明确的了解样式是怎么被渲染的。 具体的...

    lavnFan 评论0 收藏0
  • [译]HTML&CSS Lesson3: 了解CSS

    摘要:我们会在组合选择器中来了解为什么权重值要加连字符。组合选择器中的权重值会分别对不同类型的选择器进行计数。对比两组选择器,第二组选择器有两个选择器,拥有更高的权重值。 CSS是一门复杂的语言,拥有相当的大能力。 它我们允许为页面添加布局和设计,允许多个元素甚至多个页面共享样式。在我们有能力解锁所有功能之前,我们必须先充分理解它的基础点。 首先,我们要明确的了解样式是怎么被渲染的。 具体的...

    soasme 评论0 收藏0
  • CSS学习笔记(五) 规则声明

    摘要:规则由选择器和声明两部分组成,本文将要说的是第二部分声明。数字值数字值后面都有一个单位,例如英寸或点。绝对值绝对值描述的是一个真实的长度比如,英寸,而相对值则是相对于其他基准的描述比如是某某的两倍长。 CSS 规则由 选择器 和 声明 两部分组成,本文将要说的是第二部分:声明。 一个声明包含两部分:属性 和 值。 属性 指出要影响元素的哪个方面(颜色、高度,等等),而 值 ...

    kyanag 评论0 收藏0
  • 大话css预编译处理(三):基础语法篇

    摘要:值得庆幸的是,这三款预处理器语言的语法和语法都差不多。在这一节中,我们依次来对比一下这三款预处理器语言各种特性的异同之处,以及使用方法。预处理器语言支持任何变量例如颜色数值文本。 一、Sass、LESS和Stylus的语法 每一种语言都有自己一定的语法规则,CSS预处理器语言也不例外,在真正使用CSS预处器语言之前还有一个不可缺少的知识点,就是对语法的理解。值得庆幸的是,这三款CSS预...

    刘东 评论0 收藏0
  • HTML+CSS基础课程-imooc-【更新完毕】

    摘要:包含后代选择器包含选择器,即加入空格用于选择指定标签元素下的后辈元素。而后代选择器是作用于所有子后代元素。后代选择器通过空格来进行选择,而子选择器是通过进行选择。 6-1 认识CSS样式 CSS全称为层叠样式表 (Cascading Style Sheets),它主要是用于定义HTML内容在浏览器内的显示样式,如文字大小、颜色、字体加粗等。使用CSS样式的一个好处是通过定义某个样式,可...

    Heier 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<