看板 Web_Design 關於我們 聯絡資訊
※ 引述《sandy4444 (質樸)》之銘言: : 請問大大, : 小魯妹現在是 bootstrap 新手 : 想問今天想要讓你自己的網頁內容 : 在電腦上全部集中在中間的column : 比例 3:6:3 左右column 都是空白 : 然後在手機上 就只要顯示中間的部分 左右都不要 : 我現在知道的方法是 : 就用 padding 去控制他 各自在@media設定 : ex 桌機就讓他設定 padding right and left 300px : 手機上設定 0 px : 但這樣做就等於是完全沒用到grid system : 而且也要自己寫css 的 padding 完全看不出 bootstrap 的用處在哪 : 請問是否更簡單的好方法>< : 先謝謝大大回答 http://output.jsbin.com/medotewiha 程式碼推文都有講了 其實建議還是看一下bootstrap css是怎麼寫的 比較好理解, 不要死背 dev tools很好用 bootstrap grid system是12格 (3/12) = 25% 所以col-lg-offset-3 就是在col-lg解析度下margin-left: 25% 同理, 假如你寫col-lg-offset-6 就是他有margin-left:50%的屬性 col-lg-6 指的是該解析度下,該元素的width, 也就是(6/12) = 50% 你要在手機下滿版 那就是沒有margin-left, 然後width:100% class就是加上col-xs-12 -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 175.180.98.92 ※ 文章網址: https://www.ptt.cc/bbs/Web_Design/M.1430465701.A.12F.html
alair99: 看起來offset是向右位移幾格 lg是電腦版 xs是手機版嗎? 05/01 16:29
sandy4444: 你是我今天的偶像!!! 謝謝大大 JSBIN 配解說 好清楚>< 05/01 16:36
tw0517tw: xs sm md lg 的說明在官方doc都有... 05/01 18:38
k00000040: 官方文件很清楚.... 05/01 18:56