css之常用属性

背景属性:

background-attachment 设置背景图像是否固定或者随着页面的其余部分滚动
值:
scroll 	默认值。背景图像会随着页面其余部分的滚动而移动。
fixed 	当页面的其余部分滚动时,背景图像不会移动。

background-color 设置背景色
值:
color_name 	规定颜色值为颜色名称的背景颜色(比如 red)。
hex_number 	规定颜色值为十六进制值的背景颜色(比如 #ff0000)。
rgb_number 	规定颜色值为 rgb 代码的背景颜色(比如 rgb(255,0,0))。
transparent 	默认。背景颜色为透明。

background-image 设置背景图片
值:
url('URL') 	指向图像的路径。
none 	默认值。不显示背景图像。

background-position 属性设置背景图像的起始位置。
值:
x% y%

background-repeat 属性设置是否及如何重复背景图像。
值:
repeat 	默认。背景图像将在垂直方向和水平方向重复。
repeat-x 	背景图像将在水平方向重复。
repeat-y 	背景图像将在垂直方向重复。
no-repeat 	背景图像将仅显示一次。

background-origin 属性规定 background-position 属性相对于什么位置来定位。
值:
padding-box 	背景图像相对于内边距框来定位。 	
border-box 	背景图像相对于边框盒来定位。 	
content-box 	背景图像相对于内容框来定位。

background-size 属性规定背景图像的尺寸。
语法:
background-size: length|percentage|cover|contain;

 过渡属性:

transition: 样式名 过渡时间;
值:
transition-property 	规定设置过渡效果的 CSS 属性的名称。
transition-duration 	规定完成过渡效果需要多少秒或毫秒。
transition-timing-function 	规定速度效果的速度曲线。
transition-delay 	定义过渡效果何时开始。

animation
 实例
#div1{
    60px;
    height: 60px;
    -webkit-animation: first 5s;
    background-color: black;
}
@-webkit-keyframes first{
    from {background-color: red;}
    to {background-color: blue;}
}

 文本属性:

color 属性规定文本的颜色。

direction 属性规定文本的方向 / 书写方向。
值:
ltr 	默认。文本方向从左到右。
rtl 	文本方向从右到左。

letter-spacing 属性增加或减少字符间的空白(字符间距)。
值:
px

line-height 属性设置行间的距离(行高)。
值:
%|px

text-align 属性规定元素中的文本的水平对齐方式。
值:
left 	把文本排列到左边。默认值:由浏览器决定。
right 	把文本排列到右边。
center 	把文本排列到中间。
justify 	实现两端对齐文本效果。

text-decoration 属性规定添加到文本的修饰。
值:
none 	默认。定义标准的文本。
underline 	定义文本下的一条线。
overline 	定义文本上的一条线。
line-through 	定义穿过文本下的一条线。
blink 	定义闪烁的文本。

text-indent 属性规定文本块中首行文本的缩进。
值:
length 	定义固定的缩进。默认值:0。
% 	定义基于父元素宽度的百分比的缩进。
px

text-transform 属性控制文本的大小写。
值:
none 	默认。定义带有小写字母和大写字母的标准的文本。
capitalize 	文本中的每个单词以大写字母开头。
uppercase 	定义仅有大写字母。
lowercase 	定义无大写字母,仅有小写字母。

white-space 属性设置如何处理元素内的空白。
值:
normal 	默认。空白会被浏览器忽略。
pre 	空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
nowrap 	文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。
pre-wrap 	保留空白符序列,但是正常地进行换行。
pre-line 	合并空白符序列,但是保留换行符。

word-spacing 属性增加或减少单词间的空白(即字间隔)。
值:
px

ext-overflow 属性规定当文本溢出包含元素时发生的事情。
值:
clip 	修剪文本。 	
ellipsis 	显示省略符号来代表被修剪的文本。 	
string 	使用给定的字符串来代表被修剪的文本。

text-shadow 属性向文本设置阴影。
值:
h-shadow 	必需。水平阴影的位置。允许负值。 	
v-shadow 	必需。垂直阴影的位置。允许负值。 	
blur 	可选。模糊的距离。 	
color 	可选。阴影的颜色。参阅 CSS 颜色值。

 表格属性:

border-collapse 属性设置表格的边框是否被合并为一个单一的边框,还是象在标准的 HTML 中那样分开显示。
值:
separate 	默认值。边框会被分开。不会忽略 border-spacing 和 empty-cells 属性。
collapse 	如果可能,边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cells 属性。

border-spacing 属性设置相邻单元格的边框间的距离(仅用于“边框分离”模式)。
值:
ength length 	

规定相邻单元的边框之间的距离。使用 px、cm 等单位。不允许使用负值。

如果定义一个 length 参数,那么定义的是水平和垂直间距。

如果定义两个 length 参数,那么第一个设置水平间距,而第二个设置垂直间距。

empty-cells 属性设置是否显示表格中的空单元格(仅用于“分离边框”模式)。
值:
hide 	不在空单元格周围绘制边框。
show 	在空单元格周围绘制边框。默认。

 定位属性:

bottom 属性规定元素的底部边缘。该属性定义了定位元素下外边距边界与其包含块下边界之间的偏移。
注释:如果 "position" 属性的值为 "static",那么设置 "bottom" 属性不会产生任何效果。
值:
auto 	默认值。通过浏览器计算底部的位置。
% 	设置以包含元素的百分比计的底边位置。可使用负值。
length 	使用 px、cm 等单位设置元素的底边位置。可使用负值。

clear 属性规定元素的哪一侧不允许其他浮动元素。
值:
left 	在左侧不允许浮动元素。
right 	在右侧不允许浮动元素。
both 	在左右两侧均不允许浮动元素。
none 	默认值。允许浮动元素出现在两侧。

clip 属性剪裁绝对定位元素。
值:
shape 	设置元素的形状。唯一合法的形状值是:rect (top, right, bottom, left)
auto 	默认值。不应用任何剪裁。
实例:
clip:rect(0px,60px,200px,0px);

cursor 属性规定要显示的光标的类型(形状)。
值:
url 	

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

注释:请在此列表的末端始终定义一种普通的光标,以防没有由 URL 定义的可用光标。
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 	此元素会作为列表显示。

float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动。浮动元素会生成一个块级框,而不论它本身是何种元素。

如果浮动非替换元素,则要指定一个明确的宽度;否则,它们会尽可能地窄。

注释:假如在一行之上只有极少的空间可供浮动元素,那么这个元素会跳至下一行,这个过程会持续到某一行拥有足够的空间为止。
值:
left 	元素向左浮动。
right 	元素向右浮动。
none 	默认值。元素不浮动,并会显示在其在文本中出现的位置。

left 属性规定元素的左边缘。该属性定义了定位元素左外边距边界与其包含块左边界之间的偏移。
注释:如果 "position" 属性的值为 "static",那么设置 "left" 属性不会产生任何效果。
值:
auto 	默认值。通过浏览器计算左边缘的位置。
% 	设置以包含元素的百分比计的左边位置。可使用负值。
length 	使用 px、cm 等单位设置元素的左边位置。可使用负值。
说明:类似的还有right、top、bottom。

overflow 属性规定当内容溢出元素框时发生的事情。
值:
visible 	默认值。内容不会被修剪,会呈现在元素框之外。
hidden 	内容会被修剪,并且其余内容是不可见的。
scroll 	内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。
auto 	如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。

position 属性规定元素的定位类型。
值:
absolute 	
生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。
元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。

fixed 	
生成绝对定位的元素,相对于浏览器窗口进行定位。
元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。

relative 	
生成相对定位的元素,相对于其正常位置进行定位。
因此,"left:20" 会向元素的 LEFT 位置添加 20 像素。

static 	默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。

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

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

z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。
注释:元素可拥有负的 z-index 属性值。

注释:Z-index 仅能在定位元素上奏效(例如 position:absolute;)!
说明

该属性设置一个定位元素沿 z 轴的位置,z 轴定义为垂直延伸到显示区的轴。如果为正数,则离用户更近,为负数则表示离用户更远。
值:
auto 	默认。堆叠顺序与父元素相等。
number 	设置元素的堆叠顺序。

 内边距属性(Padding):

padding 简写属性在一个声明中设置所有内边距属性。
值:
auto 	浏览器计算内边距。
length 	规定以具体单位计的内边距值,比如像素、厘米等。默认值是 0px。
% 	规定基于父元素的宽度的百分比的内边距。

 注意:按照顺时针排序。

外边距属性(Margin):

margin 简写属性在一个声明中设置所有外边距属性。该属性可以有 1 到 4 个值。
值:
auto 	浏览器计算外边距。
length 	规定以具体单位计的外边距值,比如像素、厘米等。默认值是 0px。
% 	规定基于父元素的宽度的百分比的外边距。
注意:也是顺时针你排序。

 列表属性(List):

list-style-type
位于第一个位置,常见的值有:
none 	无标记。
disc 	默认。标记是实心圆。
circle 	标记是空心圆。
square 	标记是实心方块。
decimal 	标记是数字。
decimal-leading-zero 	0开头的数字标记。(01, 02, 03, 等。)
lower-latin 	小写拉丁字母(a, b, c, d, e, 等。)
upper-latin 	大写拉丁字母(A, B, C, D, E, 等。)

list-style-position
值:
inside 标记放在文本内
outside 标记放在文本外

简写:
list-style:type position url()

 字体属性(Font):

font-family 规定元素的字体系列。

font-size 属性可设置字体的尺寸。
值:
    xx-small
    x-small
    small
    medium
    large
    x-large
    xx-large
把字体的尺寸设置为不同的尺寸,从 xx-small 到 xx-large。
默认值:medium。
smaller 	把 font-size 设置为比父元素更小的尺寸。
larger 	把 font-size 设置为比父元素更大的尺寸。
length 	把 font-size 设置为一个固定的值。
% 	把 font-size 设置为基于父元素的一个百分比值。

font-style 属性定义字体的风格。
值:
normal 	默认值。浏览器显示一个标准的字体样式。
italic 	浏览器会显示一个斜体的字体样式。
oblique 	浏览器会显示一个倾斜的字体样式。

font-weight 属性设置文本的粗细。
值:
normal 	默认值。定义标准的字符。
bold 	定义粗体字符。
bolder 	定义更粗的字符。
lighter 	定义更细的字符。
    100
    200
    300
    400
    500
    600
    700
    800
    900
定义由粗到细的字符。400 等同于 normal,而 700 等同于 bold。

 尺寸属性(Dimension):

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

类似的还有width、minheight、maxwidth。

 边框属性(Border 和 Outline):

border 简写属性在一个声明设置所有的边框属性。
可以按顺序设置如下属性:

    border-width
    border-style
    border-color

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

注释:轮廓线不会占据空间,也不一定是矩形。

outline 简写属性在一个声明中设置所有的轮廓属性。
可以按顺序设置如下属性:

    outline-color
    outline-style
    outline-width

border-radius 属性是一个简写属性,用于设置四个 border-*-radius 属性。
值:
px

box-shadow 属性向框添加一个或多个阴影。
值:
h-shadow 	必需。水平阴影的位置。允许负值。 	
v-shadow 	必需。垂直阴影的位置。允许负值。 	
blur 	可选。模糊距离。 	
spread 	可选。阴影的尺寸。 	
color 	可选。阴影的颜色。请参阅 CSS 颜色值。 	
inset 	可选。将外部阴影 (outset) 改为内部阴影。 	

outline (轮廓)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用。
注释:轮廓线不会占据空间,也不一定是矩形。
outline 简写属性在一个声明中设置所有的轮廓属性。
可以按顺序设置如下属性:
    outline-color
    outline-style
    outline-width
原文地址:https://www.cnblogs.com/leomei91/p/7172077.html