伪选择器:after的清浮动简单效果

:after的作用是在当前的应用元素后面添加内容

如div:after{

　　content:"This is a demo"

}

还有就是清除浮动(参考代码):

<style>
    #box{border:2px solid #ccc;}
    .clear:after{content:'';display:block;clear:both;}
    .box{width:200px;height:100px;background:red;float:left;}
</style>
</head>

<body>
    <div id="box">
        <div class="box"></div>
        <div class="clear"></div>
    </div>
</body>

 

posted @ 2014-08-20 12:48  宇宙第一小菜鸟  阅读(137)  评论(0)  编辑  收藏  举报