多语言展示
当前在线:1529今日阅读:27今日分享:41

box-sizing属性

W3C对box-sizing属性的定义:box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素。
方法/步骤
1

例如,假如您需要并排放置两个带边框的框,可通过将 box-sizing 设置为 'border-box'。这可令浏览器呈现出带有指定宽度和高度的框,并把边框和内边距放入框中。简单来讲就是:比如我们在开发过程中,网页主体内容宽度为1000px,假设我们有两个div,每个div的宽度为500px,要求并列,要实现这样的要求很简单,只要给这两个加个float属性就可以了。

2

但是如果有一天我们需要给这两个div加上一个1px的边框,那么两个div总体的宽度为1002px,这样的结果就是后面的一个div会掉下来了。这时候我们要想两个div并列在一起,就要把两个div的宽度设为498,才能并列在一起。但是我们非要要求两个div的宽度只能为500,主体宽度只能为1000,那该怎么办,这个时候box-sizing就派上用场了。

推荐信息