2017-03-25 CSS 样式
1，大小
宽度： width:"100px/50%"
高度： height:"100px" 实现高度100% position:fixed; 配合使用
2，背景 【写在<head></head>之间 ， <style type="text/css"> body{ }</style>里面】
背景色： background-color：red/#颜色代码;
背景图片： background-image:url(图片路径) ;
背景图的平铺方式: background-repeat:选择属性;
背景图片位置: background-position:（top/bottom/left/right）;
设置背景图片是否滚动: background-attachment：（选择属性）；
3,文字
字体样式: font-family:宋体;
字体大小: font-size:4px; (一般在12px -14px之间）
倾斜: font-style:italic;
加粗: font-weight :bold;
划线: text-decoration:underline（下划线）/overline（上划线）/line-through（删除线）/none（没有，用来去掉超链接的下划线）;
字体颜色: color:red/#颜色代码;
4,对齐
水平对齐： text-align:对齐属性；
垂直对齐： display:table-cell;加上vertical-align:对齐属性; （两个必须一起才能实现对齐）
行高： line-height：10px; （在只有一行文字，行高等于所在元素高度时，实现垂直居中）
文字缩进 ： text-indent：5px; （对象为文本文字，为正值时对第一行操作相当于空格，空出单位像素。为负值时，向左隐藏单位距离的文本文字）
5,边距，边线
内边距： padding-(top/bottom/left/right):10px; （增加内边距，会相应的使所在元素的位置扩大）
外边距： margin-(top/bottom/left/right):10px; （是两个元素之间出现间距，不改变元素大小）
边线粗细，线型，颜色： border:1px solid(实线) red/#元素代码;
6, 对有序列表/无序列表的处理
去掉内容前的序号/圆点 ： list-style:none;
将前面的序号/圆点变为图片 list-style-image:url(图片路径);
7,流式布局（流式布局实际上已经浮动，处于平面的上层）
左侧流式布局： float:left;
右侧流式布局： float:right;
清除流式布局： <div ></div> (clear:both;是清除流布局，一般创建一个没有长宽高的层标签来清除流式布局)
8，分层
z-index分层： z-index:5555; （数值越大的，就是能看到的）
9，display
隐藏(用户看不到,不占位置)： diaplay:none;
显示（用户能看到）： display:block;
div宽度等于文字宽度： display:inline-block;
10,visibility
隐藏：（用户看不到内容，但能看到位置）： visibility:hidden;
显示： visibility:visible;
11,超出范围内容（出现滚动条）
横向，纵向滚动条都显示：overflow:hidden;/overflow:auto;
只显示纵向滚动条：overflow-y:scroll;
只显示横向滚动条：overflow-x:scroll;
12,透明度
opacity:0.5; -moz-opacity:0.5; filter:alpha(opacity=50) 【数值越小，透明度越大】
13,圆角(将div棱角变成圆角)
border-radius:5px;
14，阴影
box-shadow:0 0 5px white; 【第一个0光线方向正值从左侧来负值从右侧来，第二个0光线方向正值从上侧来负值从下面来，第三个5是虚化程度】
15，定位（写入position后可以用top/bottom/left/right来改变位置）
相对定位（占位置）：position:relative;使元素作为常规元素出现，并且使position:absolute;在其中定位。用top/bottom/left/right来改变位置时，占据其他元素位置。
绝对定位（不占位置）：position:absolute;单独使用后浮动，top/bottom/left/right来改变位置时，不占据其他元素位置。
固定在浏览器某个位置：position:fixed;
