CSS1&CSS2的颜色方式

Color Name方式

用颜色关键字表示对应的颜色。

例如:red(红色)、blue(蓝色)、pink(粉色)

优点:方便快捷而且特定颜色比较准确

缺点:英文记忆很是个问题 表示颜色数量有限。 不支持透明颜色.

HEX方式

十六进制记法 ,使用十六进制表示颜色

语法:#RRGGBB 或 #RGB

取值: RR: 红色值。十六进制正整数 GG: 绿色值。

十六进制正整数 BB: 蓝色值。

十六进制正整数 取值范围:00-FF

RGB方式

RGB记法。

语法:RGB(R,G,B)

取值: R: 红色值。正整数 | 百分数

G: 绿色值。正整数 | 百分数

B: 蓝色值。正整数 | 百分数

取值范围:0~255或者0%~100%

CSS3 新增颜色表示方式

RGBA模式

RGBA记法。

此色彩模式与RGB相同,只是在RGB模式上新增了Alpha透明度。

语法:RGBA(R,G,B,A)

取值: R: 红色值。正整数 | 百分数 G: 绿色值。正整数 | 百分数 B: 蓝色值。正整数 | 百分数 A: Alpha透明度。

取值0~1之间。 例如:rgba(255,0,0.5)半透明红色

HSL模式

HSL记法。 (色轮模式)

语法:HSL(H,S,L)

取值: H: Hue(色调)。 0(或360)表示红色,120表示绿色,240表示蓝色,也可取其他数值来指定颜色。

取值为:0 - 360 S: Saturation(饱和度)。取值为:0.0% - 100.0% L: Lightness(亮度)。

取值为:0.0% - 100.0% 例如:hsl(360,50%,50%) 红色

HSLA模式

HSL记法。 (色轮模式)

语法:HSLA(H,S,L,A)

取值: H: Hue(色调)。 0(或360)表示红色,120表示绿色,240表示蓝色,也可取其他数值来指定颜色。

取值为:0 - 360 S: Saturation(饱和度)。取值为:0.0% - 100.0% L: Lightness(亮度)。

取值为:0.0% - 100.0% A: Alpha透明度。取值0~1之间。 例如:hsl(360,50%,50%,0.5) 红色

transparent

特殊颜色值,表示透明色。可以直接当做颜色使用。 例如:color:transparent 设定字体颜色为透明

Opacity属性

作用:设定元素的透明度。

取值:0~1之间

注意:对于尚不支持opacity属性的IE浏览器

滤镜:filter:alpha(opacity=50) 仅限IE

css颜色表示的更多相关文章

  1. 【CSS进阶】CSS 颜色体系详解

    说到 CSS 颜色,相比大家都不会陌生,本文是我个人对 CSS 颜色体系的一个系统总结与学习,分享给大家. 先用一张图直观的感受一下与 CSS 颜色相关大概覆盖了哪些内容. 接下来的行文内容大概会按照 ...

  2. CSS颜色代码

    颜色值 CSS 颜色使用组合了红绿蓝颜色值 (RGB) 的十六进制 (hex) 表示法进行定义.对光源进行设置的最低值可以是 0(十六进制 00).最高值是 255(十六进制 FF).从 0 到 25 ...

  3. 第 14 章 CSS 颜色与度量单位

    学习要点: 1.颜色表方案 2.度量单位 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 颜色和度量单位等问题,包括颜色的选取方式.相对长度和绝对长度等. 一.颜色表方案 颜色的表现形式主要有 ...

  4. CSS 颜色代码大全

    CSS颜色: 转载:http://www.cnblogs.com/axing/archive/2011/04/09/CSS.html

  5. CSS颜色代码 颜色值 颜色名字大全(转载)

    CSS颜色代码 颜色值 颜色名字大全 转载处http://flyjj.com/css-colour-code.html 颜色值 CSS 颜色使用组合了红绿蓝颜色值 (RGB) 的十六进制 (hex) ...

  6. CSS颜色代码大全

    CSS颜色代码大全 转载:http://blog.163.com/wujinhongisme@126/blog/static/3613698020095115919389/ RGB ( Red,Gre ...

  7. 第七十六节,css颜色和透明度,盒子阴影和轮廓,光标样式

    css颜色和透明度,盒子阴影和轮廓,光标样式 学习要点: 1.颜色和透明度 2.盒子阴影和轮廓 3.光标样式 一.颜色和透明度 颜色我们之前其实已经用的很多了,比如字体颜色.背景颜色.边框颜色.但除了 ...

  8. 第七十一,CSS颜色与度量单位

    CSS颜色与度量单位 学习要点: 1.颜色表方案 2.度量单位 本章主要探讨HTML5中CSS颜色和度量单位等问题,包括颜色的选取方式.相对长度和绝对长度等.   一.颜色表方案 1 颜色的表现形式主 ...

  9. (转)CSS颜色及<a>标签超链接颜色改变

    CSS颜色大全 <a>标签超链接颜色改变 A:hover   {BACKGROUND-COLOR:   #ffccff;   COLOR:   #0080ff}     (hover表示鼠 ...

  10. CSS颜色代码 颜色值 颜色名字大全

    颜色值 CSS 颜色使用组合了红绿蓝颜色值 (RGB) 的十六进制 (hex) 表示法进行定义.对光源进行设置的最低值可以是 0(十六进制 00).最高值是 255(十六进制 FF).从 0 到 25 ...

随机推荐

  1. 复制到剪贴板的JS实现--ZeroClipboard (兼解决IE下兼容问题)

    复制到剪贴板的JS实现--ZeroClipboard (兼解决IE下兼容问题) 相信绝大多数人都遇到过这样的功能实现,“复制”或者“复制到剪贴板”这样的功能.但是由于各大浏览器的实现方案不一样,导致几 ...

  2. JS教程:获取当前地址栏URL

    URL即:统一资源定位符 (Uniform Resource Locator, URL) 完整的URL由这几个部分构成:scheme://host:port/path?query#fragment s ...

  3. IOS中图片拉伸技巧与方法总结(转载)

    以下内容转载自:http://my.oschina.net/u/2340880/blog/403996 IOS中图片拉伸技巧与方法总结 一.了解几个图像拉伸的函数和方法 1.直接拉伸法 简单暴力,却是 ...

  4. PLSQL 逻辑多线程机制

    CREATE OR REPLACE PACKAGE jv_para_pkg IS PROCEDURE main(i_job_name   VARCHAR2,                 i_job ...

  5. JavaScript基本语法

    本节和CSS语法类似,理解这些语法以后,就可以按照Bootstrap的开发规范去开发自己的各种插件了. ||和&&运算符 ||表示,如果第一个元素可以转换为true,则返回第一个元素的 ...

  6. Angular(2)

    1.自定义指令,直接栗子: note:定义指定是驼峰,2部分 前缀+作用,but  调用 改驼峰首字母大写处为 (-首字母小写) <!DOCTYPE html><html lang= ...

  7. eclipse默认文件编码

    eclipse里 就是在eclipse.ini文件里添加一行-Dfile.encoding=utf-8即可 -startup plugins/org.eclipse.equinox.launcher_ ...

  8. Flex 加载tiff

    gis系统常常要加载tiff,因为好多土地证书,各种文件都是扫描件,如果你是用as来写的前台,怎么加载呢,顺便说下用插件AlternaTIFF也是可以得不过浏览器加载这么多插件是不太好的. 首先TIF ...

  9. java web须知细节

    1.${pageContext.request.contextPath}是从这个请求路径(URL)上截取你的项目应用名的,比如你的项目名是hello,截取的结果应该就是/hello,/代表http// ...

  10. PHP常见方法

    1.获取字符串长度: preg_match_all('/./us', $only, $match); echo count($match[0]); 2.Php除法取整 2.1.round — 对浮点数 ...