共计 441 个字符,预计需要花费 2 分钟才能阅读完成。
Box Sizing
实现成果如下
蕴含 border 和 paddin, 代码实现如下:
<div
class="box-border h-20 w-32 p-4 border-4 border-gray-400 bg-gray-200 mb-4"
>
<div class="h-full w-full bg-gray-400"></div>
</div>
不蕴含 border 和 padding, 代码实现:
<div
class="box-content h-20 w-32 p-4 border-4 border-gray-400 bg-gray-200 mb-4"
>
<div class="h-full w-full bg-gray-400"></div>
</div>
响应式实现
<div
class="box-border md:box-content h-20 w-32 p-4 border-4 border-gray-400 bg-gray-200 mb-4"
>
<div class="h-full w-full bg-gray-400"></div>
</div>
正文完