!!!常用CSS代码

浏览数：33 / 时间：2015年06月09日

.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 (扩展阅读)

 

 

 

!!!常用CSS代码,古老的榕树,5-wow.com

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

标签： class java 代码 html style src class java 代码 html style src

相关文章

随机文章

您可能还喜欢

您可能还喜欢