html5--6-13 CSS3中的颜色表示方式

学习要点

掌握选择器的优先级问题
掌握CSS3中新增的颜色表示方式

选择器的优先级问题

原则上：元素选择器<类选择器< ID选择器<行内样式
谁指向精确谁的优先级高
并列的话谁在后边谁优先级高

CSS2时代的颜色表示方法

关于颜色的小知识

颜色是通过对红、绿和蓝光的组合来显示的。早期的电脑只支持最多 256 种颜色时，但是现在大多数电脑都能显示数百万种颜色。

颜色名称

优点：方便快捷而且特定颜色比较准确
缺点：表示颜色数量有限，英文不好的不容易记住，不支持透明度的表示

十六进制方式

优点：表示颜色种类多，使用较方便
缺点：不支持透明颜色。

RGB方式三原色配色方式

优点：表示颜色种类多，使用较方便
缺点：不支持透明颜色。

CSS3新增的颜色表示方法

RGBA方式三原色配色方式

在RGB模式上新增了Alpha透明度。

HSL模式

语法:HSL(H,S,L)，HSL分别表示色调，饱和度，亮度
- H:0(或360)表示红色，120表示绿色，240表示蓝色，也可取其他数值来指定颜色。取值为：0 - 360
- S:(饱和度)。取值为：0.0% - 100.0%
- L:(亮度)。取值为：0.0% - 100.0%

HSLA模式

HSL模式上新增了Alpha透明度。

html5--6-13 CSS3中的颜色表示方式相关推荐

【分享】html5 开发工具——WeX5中的各种绑定方式
今天整理一下 html5 开发工具--WeX5中的各种绑定方式,下面分为表现类.流程类.交互类 3 种类型分别介绍. 表现类绑定表现类的绑定属性有visible.text.html.css.styl ...
HTML5实践 -- 介绍css3中的几个属性：text-shadow、box-shadow 和 border-radius
转载请注明原创地址:http://www.cnblogs.com/softlover/archive/2012/11/21/2779873.html 今天我们的内容是css3的text-shadow. ...
详解html5新增的标签与css3中伪类和伪元素
html5 / css3 基础篇(第一篇) 回顾是的,你没看错!今天是一个全新的开始,今天这一讲我们就要开始h5和c3了,html 和 css的基础篇我们都告一段落了.html一共两篇,css走过了 ...
html5 css3中的一些笔记
<!DOCTYPE html> <html> <head><meta charset="utf-8" ><title>c ...
html5中阴影,HTML5 Canvas 中的颜色、样式和阴影的属性和方法
颜色.样式和阴影的属性与方法 fillStyle 设置或返回用于填充绘画的颜色.渐变或模式 strokeStyle 设置或返回用于笔触的颜色.渐变或模式 ...
html5 css 响应式_在HTML5 / CSS3中编写响应式简历
本文是我们的" Web响应式设计系列"的一部分,该系列由工具,资源和教程组成,可帮助您为所有平台的用户创建网站. 单击此处查看同一系列的更多文章. 业务部分的几乎每个人都在某个时间 ...
css3中的变形（transform）、过渡(transtion)、动画(animation)
Transform字面上就是变形,改变的意思.在CSS3中transform主要包括以下几种:旋转rotate.扭曲skew.缩放scale和移动translate以及矩阵变形matrix.下面我们一 ...
HTML5+CSS、CSS3基础知识点总结
一.选择器选择器分为基础选择器和复合选择器两大类. 基础选择器由单个选择器组成基础选择器包括:标签选择器.类选择器.id 选择器和通配符选择器(*) 标签选择器优点标签选择器可以把某一标签全部 ...
css3中变形与动画（三）
transform可以实现矩阵变换,transition实现属性的平滑过渡,animation意思是动画,动漫,这个属性才和真正意义的一帧一帧的动画相关.本文就介绍animation属性. anima ...

html5--6-13 CSS3中的颜色表示方式

html5--6-13 CSS3中的颜色表示方式

学习要点

关于颜色的小知识

html5--6-13 CSS3中的颜色表示方式相关推荐

最新文章

热门文章