【CSS】CSS 样式的常见属性：文本、字体、背景、表格、列表、光标、display、position、float 和 clear
| 取值 | 描述 |
| text-decoration : none | 删除链接下划线 |
| text-decoration : underline | 加下划线 |
| text-decoration : overline | 加顶线 |
| text-decoration : line-through | 加删除线 |
| text-decoration : blink | 文本闪烁 |
| text-decoration : inherit | 从父元素继承 text-decoration 属性的值 |
| 取值 | 描述 |
| text-indent : 30px | 段落首行缩进 |
| 取值 | 描述 |
| text-transform : capitalize | 首字大写 |
| text-transform : uppercase | 英文大写 |
| text-transform : lowercase | 英文小写 |
| 取值 | 描述 |
| text-align : right | 文字右对齐 |
|
text-align : right |
文字右对齐 |
|
text-align : left |
文字左对齐 |
|
text-align : center |
文字居中对齐 |
| text-align : justify | 文字分散对齐 |
| 取值 | 描述 |
|
vertical-align : top |
垂直向上对齐 |
|
vertical-align : bottom |
垂直向下对齐 |
|
vertical-align : middle |
垂直居中对齐 |
|
vertical-align : text-top |
文字垂直向上对齐 |
| vertical-align : text-bottom | 文字垂直向下对齐 |
| 取值 | 描述 |
|
color : #999999 |
文字颜色 |
|
font-family : 宋体,sans-serif |
文字字体 |
|
font-size : 9pt |
文字大小 |
|
font-style : itelic |
文字斜体 |
|
font-variant : small-caps |
小字体 |
|
letter-spacing : 1pt |
字间距离 |
|
line-height : 200% |
设置行高 |
| font-weight : bold | 文字粗体 |
|
vertical-align : sub |
下标字 |
| vertical-align : super | 上标字 |
| 取值 | 描述 |
|
background-color : #F5E2EC |
背景颜色 |
|
background : transparent |
透视背景 |
| 取值 | 描述 |
|
background-image : url(/image/bg.gif) |
背景图片 |
|
background-attachment : fixed |
背景是否随页面内容一起滚动，scroll 滚动，fixed 固定 |
| 取值 | 描述 |
|
background-repeat : repeat |
x/y 双向平铺-网页默认 |
|
background-repeat : no-repeat |
不平铺 |
|
background-repeat : repeat-x |
横向平铺 |
|
background-repeat : repeat-y |
纵向平铺 |
| 取值 | 描述 |
|
background-position : 90% 90% |
背景图片x与y轴的位置 |
|
background-position : top |
向上对齐 |
|
background-position : buttom |
向下对齐 |
| background-position : left | 向左对齐 |
| background-position : right | 向右对齐 |
| background-position : center | 居中对齐 |
| 取值 | 描述 |
|
border-top : 1px solid #6699cc |
上框线 |
|
border-bottom : 1px solid #6699cc |
下框线 |
|
border-left : 1px solid #6699cc |
左框线 |
| border-right : 1px solid #6699cc | 右框线 |
| 以上是建议书写方式,但也可以使用常规的方式 如下: | |
| border-top-color : #369 | 设置上框线top颜色 |
| border-top-width :1px | 设置上框线top宽度 |
| border-top-style : solid | 设置上框线top样式 |
| 取值 | 描述 |
|
solid |
实线框 |
|
dotted |
点线框 |
|
dashed |
虚线框 |
|
double |
双线框 |
| groove | 立体内凸框 |
| ridge | 立体浮雕框 |
| inset | 凹框 |
| outset | 凸框 |
| 取值 | 描述 |
|
margin-top : 10px |
上外边距 |
|
margin-right : 10px |
右外边距 |
|
margin-bottom : 10px |
下外边距 |
| margin-left : 10px | 左外边距 |
| 取值 | 描述 |
|
padding-top : 10px |
上内边距 |
|
padding-right : 10px |
右内边距 |
|
padding-bottom : 10px |
下内边距 |
| padding-left : 10px | 左内边距 |
| 取值 | 描述 |
|
list-style-type : none |
没有编号 |
|
list-style-type : decimal |
阿拉伯数字 |
|
list-style-type : lower-roman |
小写罗马数字 |
| list-style-type : upper-roman | 大写罗马数字 |
|
list-style-type : lower-alpha |
小写英文字母 |
| list-style-type : upper-alpha | 大写英文字母 |
|
list-style-type : disc |
实心圆形符号 |
|
list-style-type : circle |
空心圆形符号 |
|
list-style-type : square |
实心方形符号 |
| list-style-image : url(/dot.gif) | 图片式符号 |
|
list-style-position : outside |
列表符号位置，凸排 |
| list-style-position : inside | 列表符号位置，缩进 |
| 取值 |
描述 |
| cursor : url |
需使用的自定义光标的 URL。 注释：请在此列表的末端始终定义一种普通的光标，以防没有由 URL 定义的可用光标。 |
| cursor : auto | 默认光标，文本时显示  ，超链接时显示 |
| cursor : crosshair | 光标呈现为十字线 |
| cursor : pointer | 光标呈现为指示链接的指针（一只手） |
| cursor : move | 此光标指示某对象可被移动 |
| cursor : e-resize | 此光标指示矩形框的边缘可被向右（东）移动。 |
| cursor : ne-resize | 此光标指示矩形框的边缘可被向上及向右移动（北/东） |
| cursor : nw-resize | 此光标指示矩形框的边缘可被向上及向左移动（北/西） |
| cursor : n-resize | 此光标指示矩形框的边缘可被向上（北）移动。 |
| cursor : se-resize | 此光标指示矩形框的边缘可被向下及向右移动（南/东）。 |
| cursor : sw-resize | 此光标指示矩形框的边缘可被向下及向左移动（南/西）。 |
| cursor : s-resize | 此光标指示矩形框的边缘可被向下移动（南）。 |
| cursor : w-resize | 此光标指示矩形框的边缘可被向左移动（西）。 |
| cursor : text | 此光标指示文本 |
| cursor : wait | 此光标指示程序正忙（通常是一只表或沙漏） |
| cursor : help | 此光标指示可用的帮助（通常是一个问号或一个气球） |
| 取值 | 描述 |
| display : none | 此元素不会被显示。 |
| display : block | 此元素将显示为块级元素，此元素前后会带有换行符。 |
| display : inline | 默认。此元素会被显示为内联元素，元素前后没有换行符。 |
| 取值 |
描述 |
| position : absolute |
生成绝对定位的元素，相对于离它最近的一个已定位的盒子进行定位的（默认是body） 元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。 |
| position : fixed |
生成绝对定位的元素，相对于浏览器窗口进行定位。 元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。 |
| position : relative |
生成相对定位的元素，相对于其正常位置进行定位。 因此，"left:20" 会向元素的 LEFT 位置添加 20 像素。 |
| position : static | 默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right 或者 z-index 声明）。 |
| position : inherit | 规定应该从父元素继承 position 属性的值。 |
| z-index : 1 | 当使用相对定位或绝对定位时，元素经常会出现相互重叠，此时可以使用 z-index 属性设置元素之间的叠放顺序，数值越大，越往上层，离用户越近。 |
| 取值 | 属性 |
| float : left | 元素向左浮动,假如在一行之上只有极少的空间可供浮动元素，那么这个元素会跳至下一行，这个过程会持续到某一行拥有足够的空间为止。 |
| float : right | 元素向右浮动。 |
| float : none | 默认值。元素不浮动，并会显示在其在文本中出现的位置。 |
| float : inherit | 规定应该从父元素继承 float 属性的值。 |
| 取值 | 属性 |
| clear : left | 在左侧不允许浮动元素。 |
| clear : right | 在右侧不允许浮动元素。 |
| clear : both | 在左右两侧均不允许浮动元素。 |
| clear : none | 默认值。允许浮动元素出现在两侧。 |
| clear : inherit | 规定应该从父元素继承 clear 属性的值。 |
