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. 點擊頁面就自動輸入到mysql.求解2. java - IDEA從SVN檢出項目 并在tomcat上運行 求詳細流程3. node.js - 帶有node_modules目錄的項目,用phpstorm打開速度極慢,怎么解決?4. node.js - nodejs使用formidable上傳文件問題5. java - 多叉樹求值,程序高手,算法高手看過來6. javascript - windos下第一次用Django無法正確創建工程目錄7. css - 請問B站頂部的模糊半透明導航條是怎么實現的呢?8. html5 - 有人做過防微信app界面的H5 demo嗎?9. javascript - JS用ajax爬取百度外賣店家信息10. 靜態資源文件引入無效
