CSS--常用属性

字体属性

font-size : 16px; //设置字体大小
font-family : Arial //设置字体的类型
font-style : italic || normal
font-weight : bold ||100-900 || normal //设置字体的加粗

文本属性

text-indent :10px||10%; //文字缩进10px，10%是相对于块级元素的宽度 ，这个属性只用于块级元素
white-space : nowrap; //让文字单行显示 ，会合并空格
：pre //保留文字的原格式，不合并空格，不能自动换行
letter-spacing : 0.1em ; //字体间的间距 em是字体的font-size大小
text-transform : uppercase || lowercase || capitalize //转为大小或小写或单词首字母大写
text-align：center || left || right
text-decoration : none || underline || linethough
line-height : 10px || normal || 1.2 || 120% // 设置行高 1.2 || 120%是相对文字大小
vertical-align : baseline || middle || top || bottom || text-top || text-bottom
//设置垂直对齐方式，只应用在行内元素。

框属性

width : auto || 10% || 10px
应用于：块级元素和替换元素 无继承性
//对于块级元素auto会自动让元素变得尽量和父级元素的width一样宽。10%是相当于父元素。负margin会拉宽width，因为下面这个等式：
margin-left + border-left +padding-left + width + padding-right + border-right + margin-right = 父元素的width
marign 为auto会让元素在父元素中水平居中(此时width要为定值或者百分比，只对block元素有效)
对于block,width ,margin-left right 都为定值时，margin-right会变为auto
inline-block 的width默认是包裹内容的宽度。

height ： auto || 10% || 10px
应用于 ： 块级元素和替换元素 无继承性
//auto指高度包裹内容的高度 10%相对于父级元素height
声明为百分值时，如果父级元素没有显示声明height,也就是auto，元素的height会被重置为auto

margin : auto || 10% || 10px
应用于所有元素 无继承性
对于block元素 auto会让元素的框宽度(不是width)等于父元素width,上下外边距为0
对于inline 和inline-block 为auto默认为0.
10%是相对于父元素的宽度(margin-top和bottom也是)
inline的margin-top和bottom不显示，inline-block显示，left right正常显示
inline和inline-block的margin不会自动合并 block的会

padding:10px || 10%
10%是相对于父元素的宽度

背景属性

background-color: red；可继承
background-image : url(xxx.png);
background-repeat:no-repeat || repeat-x || repeat-y 不重复||在水平方向重复||...

background-position:center || left || right || top || bottom ||10px ||50%
position理论上是需要有两个值得，如果只写一个默认另一个为center
center ： 图像的中心(水平或垂直)和元素的中心(水平或垂直)重合
left等之图像的边和元素内边框(即恰好包含内边距的边框)对齐
百分数：作用于元素和图像上，即从图像的左上角算百分比得到的点，与从元素左上角算百分比得到的点重合。
有两个值时，第一个是表示水平方向，第二个垂直。
10px 指图像左上角距离元素左上角的距离。

其他

overflow ： visible || hidden || scroll || auto
应用于块级元素和替换元素
无继承性
visibility ： visible || hidden
应用于所有元素
有继承性 为hidden时，会正常占据位置，只是看不到。
outline : color style width;
outline-style : none;
轮廓，和边框不一样
cursor : pointer 光标类型