CSS笔记之样式

总结一下CSS样式，做如下的笔记。

css样式

1.背景
background-color 背景色
可以接受任何合法的颜色值，其默认值是 transparent（透明）

background-image 背景图像
如body {background-image: url(/i/eg_bg_04.gif);},默认值是 none

background-repeat 背景重复
repeat-x（X轴方向）、repeat-y（Y轴方向）、no-repeat（不平铺）

background-position 背景定位
可以接受关键字（top、bottom、left、right 和 center），接受长度（100px 或 5cm），可以接受百分比（50%）

background-attachment 背景关联
可以接受值：fixed 估计背景图片，使得不随页面进行滚动，默认值为 scroll，是指随着页面进行滚动

2.文本
text-indent 缩进文本
可以接受长度，百分比 且可以被继承，子标签可以继承父标签的该属性。

text-align 水平对齐
可以接受关键字 left、right、center、justify、nherit 其中left是默认属性
text-align:center与Center标签的区别，其中Center标签不仅影响文本，还会把整个元素全部居中，而text-align:center只会影响文本。

word-spacing 字间隔
改变字（单词）之间的标准间隔，其默认值normal 与设置值为 0 是一样的。
可以接受一个正长度值（间隔增加）或一个负长度值（拉近距离）。

letter-spacing 字母间隔
可以接受任何长度值，与word-spacing的区别在于，字母间隔修改的是字符或字母之间的间隔，同样默认值normal与设置为0是一样的

text-transform 字符转换
接受的关键字为 none、uppercase、lowercase、capitalize，其中none是不做改动，capitalize只对每个单词的首字母大写

text-decoration 文本装饰
接受的关键字为none、underline、overline、line-through、blink（会让文字闪烁，不常用）

white-space 处理空白符
可以接受下面的关键字



3.字体
font-family 定义文本的字体系列
有两种不同类型的字体系列 1.通用字体（拥有相似外观的字体系列） 2.特定字体（具体的字体），其中通用字体定义了5中类型（Serif 字体、Sans-serif 字体、Monospace 字体、Cursive 字体、Fantasy 字体）

font-style 字体风格
可以接受3个值（normal - 文本正常显示、italic - 文本斜体显示、oblique - 文本倾斜显示）

font-variant 设置小型大写字母（采用不同大小的大写字母）
可以接受3个值 1.normal(默认值)、2.small-caps（显示小型大写字母）3.inherit（使用父元素的font-variant）

font-weight 字体加粗
可以接受1.normal(默认值，相当于400)2.bold（相当于700)3.bolder（定义更粗的字符。）4.lighter（定义更细的字符）5.100~900（定义由粗到细的字符）6.inherit（继承父元素的属性）

font-size 字体大小
font-size值可以是绝对或相对值

可以通过像素来设置字体的大小
通过像素设置文本大小，可以对文本大小进行完全控制（在IE中，使用该方法会有问题）
使用 em 来设置字体大小
1em 等于当前的字体尺寸。如果一个元素的 font-size 为 16 像素，那么对于该元素，1em 就等于 16 像素。在设置字体大小时，em 的值会相对于父元素的字体大小改变。

4.链接
链接有如下4种状态，其中需要注意的是a:hover 必须位于 a:link 和 a:visited 之后；a:active 必须位于 a:hover 之后
a:link - 普通的、未被访问的链接
a:visited - 用户已访问的链接
a:hover - 鼠标指针位于链接的上方
a:active - 链接被点击的时刻
链接，主要从text-decoration（文本修饰）、background-color（背景色）、color（颜色）、font（字体）等方面进行样式设置

5.表格
border-collapse 为表格设置合并边框模型 接受如下的值



border-spacing 属性设置相邻单元格的边框间的距离（仅用于“边框分离”模式），接受如下的值



caption-side 设置表格标题的位置 可以接受如下的值



empty-cells 设置是否显示表格中的空单元格 可以接受如下的值



table-layout 显示表格单元格、行、列的算法规则 可以接受如下的值



6.列表
list-style 简写属性，把所有的列表属性都放在一起。

list-style-image 将图象设置为列表项标志
可以接受值 url（图像的路径）、none（默认值）、inherit（从父元素继承）

list-style-position 设置列表中列表项标志的位置
可以接受值 inside、outside（默认值）、inherit（继承父元素） 其中inside表示为列表项目标记放置在文本以内，且环绕文本根据标记对齐

list-style-type 设置列表项标志的类型 可以接受disc（默认 实心圆）、circle（空心圆）、none（无标识）等。

7.轮廓
outline 在一个声明中设置所有的轮廓属性
可以接受如下的值 outline-color（边框的颜色）、outline-style（边框的样式）、outline-width（边框的宽度）、inherit（继承父元素）

outline-color 轮廓的颜色
可以接受各种颜色属性

outline-style 轮廓的样式 可以接受如下的值



outline-width 轮廓的宽度
可以接受的值 thin（细轮廓）、medium（默认，中等的轮廓）、thick(粗的轮廓)、length（规定轮廓粗细的值）、inherit（继承父类）