CSS规则写法

基本写法

public{

    /*------------------------*/

    width:;                                     /*  宽度  */
    height:;                                    /*  高度  */
    background:;                                /*  背景  */
    border:;                                    /*  边框  */

    /*------------------------*/

    color：；                                   /*  字体颜色       */
    font-family:;                               /*  字体           */
    font-size: ;                                /*  字体大小       */
    font-weight:;                               /*  字体粗细       */
    text-align:left|center|right ;              /*  文本水平对齐   */
    text-indent:;                               /*  首行缩进       */
    letter-spacing:;                            /*  字间距         */
    word-spacing：；                            /*  段落字间距     */
    line-height：；                             /*  行高           */

    /*------------------------*/
    float: ;                                    /*  浮动  */
    float-top:;                                 /*  上浮动  */
    float-right:;                               /*  右浮动  */
    float-bottom:;                              /*  下浮动  */
    float-left:;                                /*  左浮动  */
    clear:both;                                 /*  清除浮动    */
    /*------------------------*/
    margin:;                                    /*  外边距  */
    padding:;                                   /*  内边距  */
    /*------------------------*/
    position: relative;                         /*  相对public定位  */
    position:fixed;                             /*  浏览器窗口固定定位  */
    z-index:;                                   /*  定位层级  */
    /*------------------------*/
    display:block;                              /*  显示为块（支持宽高,块在一行显示，换行），类似span转div  */
    display:inline;                             /*  显示为内嵌（不支持宽高，内嵌同行显示，不换行）类似div转span  */
    display:inline-block;                       /*  块+内嵌（支持宽高，不换行）  */
    vertical-align：；                          /*  垂直对齐方式，配合display:inline-block使用  */
    /*------------------------*/
    visibility:;                                /*  定义元素是否可见，默认可见，hidden不可见  */
    overflow:hidden;                            /*  溢出隐藏，可清除浮动  */
    overflow:scroll;                            /*  隐藏多余的内容，显示滚动条  */
    overflow:auto;                              /*  默认显示，超出则隐藏并显示滚动条  */
    /*------------------------*/
    opacity:0~1;                                /*  透明度（0.1-0.9）都可以使用  */
    /*------------------------*/
    transition:1s;                              /*  过渡1秒钟  */

}




absolute{
    position: absolute;                         /*  相对于public进行绝对定位  */
    top:;                                       /*  绝对定位上  */
    left: ;                                     /*  绝对定位左  */
    right:;                                     /*  绝对定位右  */
    bottom: ;                                   /*  绝对定位下  */
}

添加class清除浮动，可做自增长

<style>
    .clear{clear:both};
</style>

<div class="clear"></div>

清除浮动方法参考

.clearfix{
    *zoom:1;
}
.clearfix:after{
    content:"";
    display:block;
    clear:both;
}

<div class="box clearfix"></div>