css基本使用

CSS 的选择器

CSS 每一条样式规则由三部分构成：
选择器（selector）、属性（properties）和属性值（value)

选择器（selector)也被称为选择符，它不仅是 HTML 5 文档中的元素标记，还能够是类、ID或是元素的某种状态。
根据 CSS 选择器的用途能够把选择器分为

标签选择器（标签名） 
类选择器（.类名）
ID选择器（#ID）
全局选择器（*）
组合选择器
伪类选择器

CSS中的属性

颜色单位
1）名字颜色，如gray、blue等
2）RGB颜色，如 p{color: rgb(255,0,0)}
3）十六进制颜色，如 #FF0000
4) RGBA颜色，a为不透明度，     如 p{color: rgb(255,0,0,0.8)}
5) HSL颜色：色相（Hue，0-360），饱和度（Saturation，取值0-100）和明度（Lightness，取值0-100），如 HSL(120, 80%, 80%) 
//rgb与rgba颜色都是用rgb(),只是参数不一样。

长度单位
1）绝对单位：英寸in，厘米cm，毫米mm，磅pt（印刷标准，72磅为1英寸）等
2）相对单位：
em，相对于当前对象内文本的字体尺寸，如 h1{font-size: 20pt}   h1{margin-left: 1em}
ex，一个字体的 x-height (一般是字体尺寸的一半)
px，像素 (计算机屏幕上的一个点)，最为经常使用

超级连接属性，经过伪类选择器实现，包括：

a:link       定义a对象在未被访问前的样式
a:hover      定义a对象在鼠标悬停时的样式
a:active     定义a对象被用户激活时的样式
a:visited    定义a对象在连接地址已被访问过期的样式

带有提示信息的超级连接：经过Tips方式为这个连接加上的介绍性信息。
能够在代码中添加一个描述标记title来达到这个效果。

设置超级连接的背景图

超级连接里还能够添加图片做为背景图，来增长超链接的显示效果，一般使用background-image来实现。

设置超级连接的按钮效果

按钮效果就是，当鼠标指针移动到一个超级连接上的时候，超级连接的文字或图片会有一种凹陷的效果。
利用CSS中的a:hover，当鼠标通过连接时，将链接向下、向右各移一个像素，就能够达到这种效果

a:hover{
        color:#821818;
        padding:5px 8px 3px 12px;
        background-color:#e2c4c9;
        border-top:1px solid #717171;
        border-left:1px solid #717171;
        border-bottom:1px solid #EEEEEE;
        border-right:1px solid #EEEEEE;
}

使用CSS3美化鼠标特效

CSS3 中，鼠标的箭头样式能够经过cursor属性实现。

设置表格的样式

设置表格边框的样式
在显示表格数据时，一般都带有表格边框，用来界定不一样单元格的数据。
当table表格的描述标记 border 值大于0时，显示边框，若是 border 的值为0，则不显示边框。
边框显示后，能够使用CSS3的border-collapse属性对边框进行修饰。

在CSS中，能够使用 border-width 属性来设置表格边框的宽度

设置表格边框的颜色

在CSS中，一般使用 color 属性来设置表格中的文本颜色，使用 background-color 属性来设置表格的背景色。 若是为了突出表格中的某一个单元格，还能够使用 background-color 属性来设置某一个单元格的颜色。