首页 > 代码库 > !!!常用CSS代码
!!!常用CSS代码
.box{overflow:auto;zoom:1;}
.box-in{display:inline-block;vertical-align:top;}
.border-box{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}/*ie8+*/
body,div,p,h1,h2,h3,h4,h5,h6{margin:0;padding:0;}
(待补充)
清除浮动
<style type="text/css"> div{background:#ddd;border:1px solid #000;width:400px;} .box{overflow:auto;zoom:1;}/*zoom:IE 6,7*/ img{float:right;} </style> <h1>清除浮动</h1> <div class="box"><img src="http://zh.learnlayout.com/images/ilta.png"></div> <br><br> <div><img src="http://zh.learnlayout.com/images/ilta.png"></div>
box-sizing:IE8及IE8+
<style type="text/css"> div{background:#999;width: 500px;height:100px;margin: 20px;} .simple { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .fancy { padding: 50px; border: solid #000 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .ccc{ border: solid #000 20px; } </style> <h1>box-sizing : IE8及IE8+</h1> <div class="simple">aaaaaaaa</div> <div class="fancy">aaaaaaaaa</div> <div class="ccc">aaaaaaaaa</div>
媒体查询 http://zh.learnlayout.com/media-queries.html 下次阅读
Flexbox http://zh.learnlayout.com/flexbox.html (扩展阅读)
css框架 http://zh.learnlayout.com/frameworks.html (扩展阅读)
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。