✤详细说明css小盒子实体模型以内行高padding及缩

2021-03-24 14:02 jianzhan

如圖,padding值是复合型特性依照顺时针方向(上右下做)次序,在其中padding的内行高危害小盒子尺寸的具体宽高

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
.wrap{width: 200px;height: 200px;
background-color:red;/* padding: 10px; *//* padding: 10px 20px; *//* padding: 10px 20px 30px; */padding: 10px 20px 30px 40px;}
</style>
</head>
<body>
<div class="wrap"></div>
</body>
</html>

如上编码所显示,怎样才可以确保小盒子的具体宽高不会改变,必须从这当中减掉加上的padding值!

到此这篇有关详细说明css小盒子实体模型以内行高padding及缩写的文章内容就详细介绍到这了,大量有关css小盒子实体模型內容请检索脚本制作之家之前的文章内容或再次访问下边的有关文章内容,期待大伙儿之后多多的适用脚本制作之家!