项目中对CSS的一点总结

1，CSS声明总是以分号(;)结束，声明组以大括号({})括起来:  p {color:red;text-align:center;}
2，CSS注释以 "/*" 开始, 以 "*/" 结束
3，id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 "#" 来定义。
    id="para1":
        #para1
        {
            text-align:center;
            color:red;
        }
4，class 选择器  class="center" 让该元素的文本居中:  p.center {text-align:center;}
5，font-family 属性设置文本的字体系列，font-size 属性设置文本的大小。{font-size:14px;}  font-style：指定文本的字体样式
6,Width和height属性定义表格的宽度和高度。line-height：设置行高。
7,text-align属性设置水平对齐方式，像左(left)，右(right)，或中心(center)：垂直对齐属性设置垂直对齐，比如顶部(top)，底部(bottom)或中间(center)
8,border-collapse 属性设置表格的边框是否被折叠成一个单一的边框或隔开：避免 <td>和<tr>之间造成的边框间隔，border: 1px solid green;
    border:1px solid #000; 可同时设置上右下左的边框的样式宽度及颜色
    border-width:1px 2px 3px 4px; 设置上右下左边框的宽度
    border-color:#000; 设置上右下左边框的颜色
    border-top:1px solid #000; 设置上边框的样式宽度及颜色
    border-right:1px solid #000; 设置右边框的样式宽度及颜色
    border-bottom:1px solid #000; 设置下边框的样式宽度及颜色
    border-left:1px solid #000; 设置左边框的样式宽度及颜色
    border:auto;
    border-radius:05px;添加圆角元素
    border-style 值:none: 默认无边框，dotted: 定义一个点线边框，dashed: 定义一个虚线边框，，，，，--{border-style:solid;border-width:5px;}
9，padding设置所有当前或者指定元素内边距属性。该属性可以有1到4个值。padding-top:20px;上内边距，padding-right:30px;右内边距，padding-bottom:30px;下内边距，padding-left:20px;左    内边距，padding:1px四边统一内边距
10，margin设置所有当前或者指定元素所有外边距的宽度，或者设置各边上外边距的宽度。“margin:20px;”表示四个方向的外边距都是20px；“margin:20px40px;”表示margin-top和margin-bottom为20        px，margin-right和margin-left为40px。
    “margin:20px 40px 60px80px;”表示margin-top为20px，margin-right为40px，margin-bottom为60px，margin-left为80px。大家按照顺时针方向记忆就可以了。
    margin:5px auto;意思上下为5,左右平均居中
11，outline：在一个声明中设置所有的轮廓属性
12，p{ }: 为所有 p 元素指定一个样式。.marked{ }: 为所有 class="marked" 的元素指定一个样式。.marked p{ }: 为所有 class="marked" 元素内的 p 元素指定一个样式。
    p.marked{ }: 为所有 class="marked" 的 p 元素指定一个样式，例如：<p class="marked">带下划线的 p 段落。</p>
13，display是设置元素显示的方式,block是一块状元素的方式显示，单独占据一行，其他元素跟他在同一行的会被迫换行，inline是以内联元素的方式显示，是显示在一行，none是不不显示
14，父元素上添加 overflow: auto; 来解决子元素溢出的问题:
15，（1）margin: auto：水平居中对齐一个元素(如 <div>)；图片居中对齐；（2）text-align: center;文本在元素内居中对齐；（3）position: absolute：使用定位方式，左右对齐；
    （4）float：left,左右对齐,(5)padding:垂直居中对齐 
17,<style>
        a:active
        {
            background-color:yellow;
        }
    </style>
    <a href="http://www.runoob.com/">runoob.com</a>//点击之后会变色-yellow
    如果a:hover的话鼠标移动到连接上，也会变色-yellow
    a:visited选择访问过得链接样式：
    <style>
        input:focus
        {
            background-color:yellow;
        }
    </style>
    <input type="text" name="firstname" />//鼠标出发输入框会变色-yellow
    <style>
        p:first-letter
        {
            font-size:200%;
            color:#8A2BE2;
        }
    </style>
    每个 <p>元素的第一个字母选择的样式： p:first-line每个<p>元素的第一行选择的样式：p:after每个<p>元素之后插入内容：
    
    body 
        {
            background-image:url('paper.gif');
            background-color:#cccccc;
            background-size:80px 60px; //指定背景图像的大小
        }
    body中加入一个图片