什么是css盒模型 电玩女神 2021-12-09 17:43 287阅读 0赞 # css盒模型指的是元素的margin padding border content属性 # # 盒模型一般分为两种 ie和w3c # # ie的盒模型 元素的width = content + border + padding # # w3c width = cotent # # 比如这里我们设置了width:200px,但是如果是ie渲染的话，那么content内容占的宽度就没有200px,可以通过box-sizing来切换盒模型的方式 # <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style> #box { width: 200px; height: 200px; padding: 50px; border: 3px solid deeppink; background: skyblue; /* ie */ /* box-sizing: border-box; */ /* w3c标准 */ /* box-sizing: content-box; */ } </style> <body> <div id="box"> 好无聊好无聊好无聊好无聊好 无聊好无聊好无聊好无聊好无聊好 无聊好无聊好无聊好无聊好无聊好 无聊好无聊好无聊好无聊好无聊好 无聊好无聊好无聊好无聊好无聊好 无聊好无聊好无聊好无聊好无聊好 无聊好无聊好无聊 </div> </body> </html> # 想要统一让浏览器用w3c标准可以在html页面开头加上<!DOCTYPE html> #
还没有评论，来说两句吧...