搜索文档
首页
HTML/CSS
JavaScript
服务端开发
Java教程
移动端
数据库
当前位置:
首页
HTML/CSS
CSS 参考手册
CSS 属性大全
源代码
清空
点击运行
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>CSS clear属性示例- 基础教程(div.cn)</title> <style> .clearfix:after { content: "."; display: block; height: 0; visibility: hidden; clear: both; } div { width: 500px; background: yellow; border: 1px solid #000000; } div p { width: 150px; margin: 10px; padding: 50px 0; text-align: center; } p.red { float: left; background: #ff0000; } p.green { float: right; background: #00ff00; } </style> </head> <body> <div class="clearfix"> <p class="red">Float Left</p> <p class="green">Float Right</p> </div> <p> <strong>注意</strong>:Internet Explorer 7和更早版本不支持<code>:after </code>伪元素。 IE8支持,但需要<code> <!DOCTYPE> </code>。 IE9完全支持伪元素。</p> </body> </html>
运行结果