首页 > 其他分享 >元素的宽度和高度

元素的宽度和高度

时间:2023-03-02 11:56:39浏览次数:35  
标签:填充 元素 高度 边框 宽度 25px

元素的宽度和高度

Remark重要: 当您指定一个 CSS 元素的宽度和高度属性时,你只是设置内容区域的宽度和高度。要知道,完整大小的元素,你还必须添加内边距,边框和外边距。

下面的例子中的元素的总宽度为 450px:

实例

div { width: 300px; border: 25px solid green; padding: 25px; margin: 25px; }

让我们自己算算:
300px (宽)
+ 50px (左 + 右填充)
+ 50px (左 + 右边框)
+ 50px (左 + 右边距)
= 450px

试想一下,你只有 250 像素的空间。让我们设置总宽度为 250 像素的元素:

实例

div { width: 220px; padding: 10px; border: 5px solid gray; margin: 0; }

最终元素的总宽度计算公式是这样的:

总元素的宽度=宽度+左填充+右填充+左边框+右边框+左边距+右边距

元素的总高度最终计算公式是这样的:

总元素的高度=高度+顶部填充+底部填充+上边框+下边框+上边距+下边距

https://www.lekaowang.com/jszgz/

标签:填充,元素,高度,边框,宽度,25px
From: https://www.cnblogs.com/5-si6/p/17171290.html

相关文章