box-sizing
来源:互联网 发布:淘宝网什么卖的最火 编辑:程序博客网 时间:2024/06/07 19:48
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><style>div{width: 160px;height: 80px;padding: 20px;border: 8px solid red;background: yellow;}.content-box{box-sizing: content-box;}.border-box{box-sizing: border-box;}</style></head><body><div class="content-box">Content box</div><br/><div class="border-box">Border box</div><script>/* content-box: This is the initial and default value as specified by the CSS standard. The width and height properties are measured including only the content, but not the padding, border or margin. 默认值。宽度和高度属性仅包括内容,不包含内边距,边框和外边距。 border-box: The width and height properties include the content, the padding and border, but not the margin. 宽度和高度属性包含内容,内边距和边框,但不包含外边距。 */ </script></body></html>
参考链接:
点击打开链接
阅读全文