鐩掑瓙妯″瀷 box-sizing 鐢ㄦ硶
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了鐩掑瓙妯″瀷 box-sizing 鐢ㄦ硶相关的知识,希望对你有一定的参考价值。
鏍囩锛?a href='http://www.mamicode.com/so/1/mil' title='mil'>mil
璇硶 idt charset html alt head 鏁堟灉 model璇硶锛歜ox-sizing 锛歝ontent-box || border-box || inherit
鍏冪礌锛?/strong>
content-box 涓?w3c鏍囧噯鐩掑瓙妯″瀷)
border-box 涓猴紙ie鏍囧噯鐩掑瓙妯″瀷锛?/p>
inherit锛氱户鎵跨埗绾х洅瀛愭ā鍨?/p>
鍖哄埆锛?/span>
w3c妯″瀷 涓環eight= 鍐呭鐨勯珮搴?
ie 妯″瀷 height=杈规+鍐呰竟璺?鍐呭鐨勯珮搴?/p>
濡傚浘锛?/p>
渚嬪瓙锛氬啓涓や釜div锛岃缃?box-sizing 灞炴€у垎鍒负content-box/border-box锛屽叾浠栧睘鎬у畬鍏ㄧ浉鍚屻€?/strong>
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <title>box-sizing</title> 5 <meta charset="UTF-8"> 6 <style> 7 .model-w3c{ 8 box-sizing: content-box; 9 float: left; 10 width: 100px; 11 height:100px; 12 border:10px solid #aeeeff; 13 margin: 10px; 14 padding: 10px; 15 } 16 .model-ie{ 17 box-sizing: border-box; 18 float: left; 19 width: 100px; 20 height:100px; 21 border:10px solid #aeeeff; 22 margin: 10px; 23 padding: 10px; 24 } 25 </style> 26 </head> 27 <body> 28 29 <div class="model-w3c"> 30 padding 31 <div> 32 w3c鏍囧噯 33 </div> 34 </div> 35 <div class="model-ie"> 36 ie鏍囧噯 37 </div> 38 </body> 39 </html>
杩愯鏁堟灉濡傚浘锛?/span>
over!!
以上是关于鐩掑瓙妯″瀷 box-sizing 鐢ㄦ硶的主要内容,如果未能解决你的问题,请参考以下文章