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. javascript - react input file2. python - beautifulsoup獲取網頁內容的問題3. python - 能通過CAN控制一部普通的家用轎車嗎?4. html5 - 只用CSS如何實現input框的寬度隨框里輸入的內容長短自動適應?5. javascript - angularjs ngblur不生效 onblur生效,為什么?6. 人工智能 - python 機器學習 醫療數據 怎么學7. centos7 編譯安裝 Python 3.5.1 失敗8. mysql - 分庫分表、分區、讀寫分離 這些都是用在什么場景下 ,會帶來哪些效率或者其他方面的好處9. javascript - 關于css絕對定位在ios瀏覽器被橡皮筋遮擋的問題10. c++ - 請問MySQL_Connection::isReadOnly 怎么解決?
