为什么bootstrap中col的宽度包括padding

Question

根据W3school，高度和宽度不包括填充和边距，但是，在引导程序中，col- - ，比方说，col-md-3将设置宽度= 25 ％，但这包括填充，为什么？

<div class="text-center">
<div class="row">
    <div class="col-md-4">
        <div class="well">.col-md-4</div>
    </div>
    <div class="col-md-4">
        <div class="well">.col-md-4</div>
    </div>
    <div class="col-md-4">
        <div class="well">.col-md-4</div>
    </div>
</div>
</div>

每个col的宽度为33.33％*行的宽度= 436.67px，

the width of col

the layout of col

根据每个col的布局，我们可以看到实际宽度（436.67px）=填充+宽度的内容。我认为内容宽度应该是436.67px？为什么我错了？

Answer 1

在bootstrap css中有一条规则：

* {
    box-sizing: border-box;
}

根据该规则，width的计算方式为content width + border + padding。见this article