html5 - bootstrap簡介中的一點問題
問題描述
剛才看到這句:通過為“列(column)”設置 padding 屬性,從而創建列與列之間的間隔(gutter)。通過為 .row 元素設置負值 margin 從而抵消掉為 .container 元素設置的 padding,也就間接為“行(row)”所包含的“列(column)”抵消掉了padding。不是很能理解是怎么個說法,有沒有通俗一點的說法或者例子??
問題解答
回答1: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去掉對比下,看下區別
相關文章:
1. dockerfile - 為什么docker容器啟動不了?2. angular.js - angularjs的自定義過濾器如何給文字加顏色?3. macos - mac下docker如何設置代理4. 請教各位大佬,瀏覽器點 提交實例為什么沒有反應5. javascript - iframe 為什么加載網頁的時候滾動條這樣顯示?6. dockerfile - 我用docker build的時候出現下邊問題 麻煩幫我看一下7. javascript - es6中this8. javascript - web網頁版app返回上一頁按鈕在ios設備失效怎么辦?安卓上可以,代碼如下,請大神幫助,萬分感謝。9. javascript - 用rem寫的頁面,安卓手機顯示文字是正常的,蘋果顯示的文字是特別小的是為什么呢10. 新手 - Python 爬蟲 問題 求助
