html5 - bootstrap簡介中的一點問題

問題描述

剛才看到這句：通過為“列（column）”設置 padding 屬性，從而創建列與列之間的間隔（gutter）。通過為 .row 元素設置負值 margin 從而抵消掉為 .container 元素設置的 padding，也就間接為“行（row）”所包含的“列（column）”抵消掉了padding。不是很能理解是怎么個說法，有沒有通俗一點的說法或者例子？？

問題解答

row的負margin值主要是為了消除最左邊和最右邊的column元素和container的邊距

可以看下原文（http://getbootstrap.com/css/#...）

Columns create gutters (gaps between column content) via padding. Thatpadding is offset in rows for the first and last column via negativemargin on .rows.

我們知道bootstrap中柵格的使用順序是 container -> row -> col

他們的css定義：

.container { padding-right: 10px; padding-left: 10px; margin-right: auto; margin-left: auto;}.row { margin-right: -10px; margin-left: -10px;}.col-*-* { padding-right: 10px; padding-left: 10px;}

如果沒有負margin的抵消，前后就會有間隙，你可以自己把負margin去掉對比下，看下區別