CSS属性取值

counter-reset:

描述:属性设置某个选择器出现次数的计数器的值，默认为 0。

值 
none 默认。不能对选择器的计数器进行重置。
id number     id 定义重置计数器的选择器、id 或 class。number 可设置此选择器出现次数的计数器的值，可以是正数、零或负数。
inherit 规定应该从父元素继承 counter-reset 属性的值。

vertical-align 属性设置元素的垂直对齐方式

实例：vertical-align:text-top;

取值：

baseline 默认。元素放置在父元素的基线上。
sub 垂直对齐文本的下标。
super 垂直对齐文本的上标
top 把元素的顶端与行中最高元素的顶端对齐
text-top 把元素的顶端与父元素字体的顶端对齐
middle 把此元素放置在父元素的中部。
bottom 把元素的顶端与行中最低的元素的顶端对齐。
text-bottom 把元素的底端与父元素字体的底端对齐。
length  
% 使用 "line-height" 属性的百分比值来排列此元素。允许使用负值。
inherit 规定应该从父元素继承 vertical-align 属性的值。

visibility 属性规定元素是否可见

提示：即使不可见的元素也会占据页面上的空间。请使用 "display" 属性来创建不占据页面空间的不可见元素。

默认值：visible

例： 使h2元素不可见   h2{  visibility:hidden; }

取值：

visible默认值。元素是可见的。
hidden 元素是不可见的。
collapse 当在表格元素中使用时，此值可删除一行或一列，但是它不会影响表格的布局。被行或列占据的空间会留给其他内容使用。如果此值被用在其他的元素上，会呈现为 "hidden"。
inherit 规定应该从父元素继承 visibility 属性的值。

word-spacing 属性增加或减少单词间的空白（即字间隔）

写法：word-spacing:25px;

取值：

normal默认。定义单词间的标准空间。
length 定义单词间的固定空间。
inherit 规定应该从父元素继承 word-spacing 属性的值。

letter-spacing 属性增加或减少字符间的空白（字符间距）

写法：

letter-spacing:2px 效果就是每个汉字或者英文字母之间的距离隔的比较开

letter-spacing:-3px  效果就是每个汉字或者英文字母之间的距离挨的很紧，甚至全缩在一起

取值：

normal默认。规定字符间没有额外的空间。
length 定义字符间的固定空间（允许使用负值）。
inherit 规定应该从父元素继承 letter-spacing 属性的值。

float 属性 定义元素在哪个方向浮动

提示：如果浮动非替换元素，则要指定一个明确的宽度；否则，它们会尽可能地窄

实例:
把图像向右浮动：
img{ float:right; }

取值：

left元素向左浮动。
right 元素向右浮动。
none 默认值。元素不浮动，并会显示在其在文本中出现的位置。
inherit 规定应该从父元素继承 float 属性的值。

empty-cells 属性设置是否显示表格中的空单元格（仅用于“分离边框”模式）

说明
该属性定义了不包含任何内容的表单元格如何表示。如果显示，就会绘制出单元格的边框和背景。除非 border-collapse 设置为 separate，否则将忽略这个属性。

例：隐藏表格中空单元格上的边框和背景  table  {  border-collapse:separate;   empty-cells:hide;   }

取值：

hide  不在空单元格周围绘制边框。
show 在空单元格周围绘制边框。默认。
inherit 规定应该从父元素继承 empty-cells 属性的值。

list-style 简写属性在一个声明中设置所有的列表属性

默认值：disc outside none

简写写法：list-style:square inside url('/i/arrow.gif');。

详细写法

list-style-type    设置列表项标记的类型   默认值：disc  标记是实心圆
list-style-position    设置在何处放置列表项标记  默认值：outside   保持标记位于文本的左侧。列表项目标记放置在文本以外，且环绕文本不根据标记对齐
list-style-image   使用图像来替换列表项的标记  默认值：none  无图显示

list-style-type

取值：

none无标记。
disc 默认。标记是实心圆。
circle 标记是空心圆。
square 标记是实心方块。
decimal 标记是数字。
decimal-leading-zero 0开头的数字标记。(01, 02, 03, 等。)
lower-roman 小写罗马数字(i, ii, iii, iv, v, 等。)
upper-roman 大写罗马数字(I, II, III, IV, V, 等。)
lower-alpha 小写英文字母The marker is lower-alpha (a, b, c, d, e, 等。)
upper-alpha 大写英文字母The marker is upper-alpha (A, B, C, D, E, 等。)
lower-greek 小写希腊字母(alpha, beta, gamma, 等。)
lower-latin 小写拉丁字母(a, b, c, d, e, 等。)
upper-latin 大写拉丁字母(A, B, C, D, E, 等。)
hebrew 传统的希伯来编号方式
armenian 传统的亚美尼亚编号方式
georgian 传统的乔治亚编号方式(an, ban, gan, 等。)
cjk-ideographic 简单的表意数字
hiragana 标记是：a, i, u, e, o, ka, ki, 等。（日文片假名）
katakana 标记是：A, I, U, E, O, KA, KI, 等。（日文片假名）
hiragana-iroha 标记是：i, ro, ha, ni, ho, he, to, 等。（日文片假名）
katakana-iroha 标记是：I, RO, HA, NI, HO, HE, TO, 等。（日文片假名）

list-style-position

inside列表项目标记放置在文本以内，且环绕文本根据标记对齐。

outside默认值。保持标记位于文本的左侧。列表项目标记放置在文本以外，且环绕文本不根据标记对齐。
inherit 规定应该从父元素继承 list-style-position 属性的值。

list-style-image

URL图像的路径。  例：list-style-image:url("/i/arrow.gif");
none默认。无图形被显示。
inherit规定应该从父元素继承 list-style-image 属性的值。

border  简写属性在一个声明设置所有的边框属性

border 简写属性在一个声明设置所有的边框属性，如果采用简写的写法可以在 border后面直接写三个值 例：border:1px solid  red;  这三个值分别代表边框的宽度，边框的样式，边框的颜色。

详细写法有一下三种

border-width：
border-style：
border-color：

border-width的取值

thin: 细
medium: 中
thick: 粗
<length>: 长度表示法

上面的宽度值有下面的关系: thin<medium<thick

 为border-width指定四个值

border-top-width:thick;

border-right-width:medium;

border-bottom-width:thin;

border-left-width:12px;

border-color 取值

简写取值写法： border-color:red green blue pink;  后面的四个值分别代表，上边框是红色;右边框是绿色;下边框是蓝色;左边框是粉色

详细写法是

border-color:red;----元素四个边框的颜色均为红色

border-top-color:Red;   -----上边框是红色
border-right-color:Red;-----右边框是红色
border-bottom-color:Red;---下边框是红色
border-left-color:Red;----上左边框是红色

font 简写属性在一个声明中设置所有字体属性

简写写法：font:italic bold 12px/20px arial,sans-serif;

注释：此属性也有第六个值："line-height"，可设置行间距。

可以按顺序设置如下属性：
font-style    规定字体样式
font-variant   规定字体异体
font-weight    规定字体粗细
font-size/line-height   规定字体尺寸和行高
font-family   规定字体系列

font-size :

取值：

font-size:12px; 设置对象具体 字体 大小为12px
font-size:xx-small; 设置文字大小为最小
font-size:small; 设置文字字体大小为小
font-size:x-large;设置对象字体大小为较大
font-size:larger;设置对象字体大小为大
font-size:smaller;相对于父容器中字体尺寸进行相对减小
font-size:50%;相对于父容器中字体尺寸进行相应调整为50%大小
font-size:150%;相对于父容器中字体尺寸进行相应调整为150%大小

 

font-weight

normal 默认值。定义标准的字符。
bold 定义粗体字符。
bolder 定义更粗的字符。
lighter 定义更细的字符。
100
200
300
400
500
600
700
800
900
 定义由粗到细的字符。400 等同于 normal，而 700 等同于 bold。
inherit 规定应该从父元素继承字体的粗细。

font-family: 

描述：元素的文本所用字体的名称

取值：

inherit : 默认值。浏览器显示一个标准的字体样式。

normal : 正常的字体(默认字体样式，可用于去掉html i斜体标签默认斜体样式)

italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique

oblique : 倾斜的字体

url
需使用的自定义光标的 URL。

注释：请在此列表的末端始终定义一种普通的光标，以防没有由 URL 定义的可用光标。

font-variant：

font-variant 属性设置小型大写字母的字体显示文本，这意味着所有的小写字母均会被转换为大写，但是所有使用小型大写字体的字母与其余文本相比，其字体尺寸更小。

取值：

normal默认值。浏览器会显示一个标准的字体。
small-caps 浏览器会显示小型大写字母的字体。
inherit 规定应该从父元素继承 font-variant 属性的值。 

例子：处理一串字符串   “ This is a paragraph”

font-variant: normal    效果是 This is a paragraph

font-variant: small-caps  效果是This is a paragraph

margin 简写属性在一个声明中设置所有外边距属性。该属性可以有 1 到 4 个值

简写方式：margin:10px 5px 15px 20px;  意思为  上外边距是 10px;右外边距是 5px;下外边距是 15px;左外边距是 20px

如果写成margin:10px; 就说明四个边距均设为10px

详细写法：

margin-top:auto;
margin-right:auto;
margin-left:auto;
margin-bottom:auto;

取值：可以有一下几种取值写法

auto浏览器计算外边距。
length 规定以具体单位计的外边距值，比如像素、厘米等。默认值是 0px。
% 规定基于父元素的宽度的百分比的外边距。
inherit 规定应该从父元素继承外边距。

padding 简写属性在一个声明中设置所有内边距属性

简写写法：padding:10px 5px 15px 20px;

详细写法：上内边距是 10px ; 右内边距是 5px; 下内边距是 15px ;左内边距是 20px

例子：设置 p 元素的 4 个内边距

p{ padding:2cm 4cm 3cm 4cm;}

取值：

auto浏览器计算内边距。
length 规定以具体单位计的内边距值，比如像素、厘米等。默认值是 0px。
% 规定基于父元素的宽度的百分比的内边距。
inherit 规定应该从父元素继承内边距。

cursor：鼠标的样式

取值

default : 默认光标（通常是一个箭头）
auto : 默认。浏览器设置的光标。
crosshair  : 光标呈现为十字线。
pointer  : 光标呈现为指示链接的指针（一只手）
move  : 此光标指示某对象可被移动。
e-resize  : 此光标指示矩形框的边缘可被向右（东）移动。
ne-resize : 此光标指示矩形框的边缘可被向上及向右移动（北/东）。
nw-resize  : 此光标指示矩形框的边缘可被向上及向左移动（北/西）。
n-resize  : 此光标指示矩形框的边缘可被向上（北）移动。
se-resize : 此光标指示矩形框的边缘可被向下及向右移动（南/东）。
sw-resize  : 此光标指示矩形框的边缘可被向下及向左移动（南/西）。
s-resize  : 此光标指示矩形框的边缘可被向下移动（北/西）。
w-resize : 此光标指示矩形框的边缘可被向左移动（西）。
text  : 此光标指示文本。
wait  : 此光标指示程序正忙（通常是一只表或沙漏）。
help : 此光标指示可用的帮助（通常是一个问号或一个气球）

display  元素的显示模式

none   此元素不会被显示。

block  此元素将显示为块级元素，此元素前后会带有换行符。
inline  默认。此元素会被显示为内联元素，元素前后没有换行符。
inline-block   行内块元素。（CSS2.1 新增的值）
list-item   此元素会作为列表显示。
run-in   此元素会根据上下文作为块级元素或内联元素显示。
table   此元素会作为块级表格显示（类似 <table>），表格前后带换行符。
inline-table    此元素会作为内联表格显示（类似 <table>），表格前后没换行符。
table-row-group   此元素会作为一个或多个行的分组来显示（类似 <tbody>）。
table-header-group  此元素会作为一个或多个行的分组来显示（类似 <thead>）。
table-footer-group   此元素会作为一个或多个行的分组来显示（类似 <tfoot>）。
table-row  此元素会作为一个表格行显示（类似 <tr>）。
table-column-group  此元素会作为一个或多个列的分组来显示（类似 <colgroup>）。
table-column  此元素会作为一个单元格列显示（类似 <col>）
table-cell   此元素会作为一个表格单元格显示（类似 <td> 和 <th>）
table-caption    此元素会作为一个表格标题显示（类似 <caption>）
inherit   规定应该从父元素继承 display 属性的值。

 

height 属性  属性设置元素的高度。

取值 :
auto 默认。浏览器会计算出实际的高度。
length 使用 px、cm 等单位定义高度。
% 基于包含它的块级对象的百分比高度。
inherit 规定应该从父元素继承 height 属性的值。

 

 

outline  （轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。

简写写法:   outline:#00FF00 dotted thick;

详细写法：

outline-color  轮廓的颜色  取值的比如是 red,或者#FF0088类型的
outline-style   轮廓的样式
outline-width   轮廓的宽度
如果不设置其中的某个值，也不会出问题，比如 outline:solid #ff0000; 也是允许的。

注释：请始终在 outline-color 属性之前声明 outline-style 属性。元素只有获得轮廓以后才能改变其轮廓的颜色。

outline-style:none    样式不能是 none，否则轮廓不会出现。

outline-style：none | dotted | dashed | solid | double | groove | ridge | inset | outset

默认值：none

取值：

none：无轮廓。与任何指定的outline-width值无关

dotted：点状轮廓。

dashed：虚线轮廓。

solid：实线轮廓

double：双线轮廓。两条单线与其间隔的和等于指定的outline-width值

groove：3D凹槽轮廓。

ridge：3D凸槽轮廓。

inset：3D凹边轮廓。

outset：3D凸边轮廓

 

outline-width

thin规定细轮廓。
medium 默认。规定中等的轮廓。
thick 规定粗的轮廓。
length 允许您规定轮廓粗细的值。比如5px
inherit 规定应该从父元素继承轮廓宽度的设置。

table-layout 属性  属性用来显示表格单元格、行、列的算法规则

取值

automatic :　默认。列宽度由单元格内容设定。
fixed :　列宽由表格宽度和列宽度设定。
inherit :　规定应该从父元素继承 table-layout 属性的值。