CodePen Embed - Box Model 盒模型

<div class="contentBox">contentBox</div>
<div class="contentBox">contentBox</div>

<div class="borderBox">borderBox</div>
<div class="borderBox">borderBox</div>

.contentBox {
  width: 150px; height: 150px;
  background: #ddd;
  padding-left: 50px;
  border: 10px solid red;
  margin-bottom: 20px;
}

.borderBox {
  width: 150px; height: 150px;
  background: #ddd;
  padding-left: 50px;
  border: 10px solid blue;
  margin-bottom: 20px;
  box-sizing: border-box;
}

This Pen is owned by Heidi-Liu on CodePen.

See more by @heidiliu2020 on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.