css中div盒子模型 |css控件透明度

内容 (Content)

div {
width: 200px;
height: 100px;
background-color: #eee;
}

这个盒子的内容部分被定义为200像素的宽度和100像素的高度，同时设置了一个浅灰色的背景颜色。

内边距 (Padding)

div {
width: 200px;
height: 100px;
background-color: #eee;
padding: 10px;
}

在内部边缘的内容周围添加10像素的内边距。这意味着将内容区域缩小10像素，以便给内边距留出空间。

边框 (Border)

div {
width: 200px;
height: 100px;
background-color: #eee;
padding: 10px;
border: 3px solid #333;
}

将一个3像素宽的实线边框添加到div盒子的外部。

外边距 (Margin)

div {
width: 200px;
height: 100px;
background-color: #eee;
padding: 10px;
border: 3px solid #333;
margin: 20px;
}

在div盒子的外部添加了20像素的外边距。这个盒子现在是相对于它周围的文档流移动了20像素。