Re: [問題] Bootstrap layout
※ 引述《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
推
05/01 16:29, , 1F
05/01 16:29, 1F
推
05/01 16:36, , 2F
05/01 16:36, 2F
推
05/01 18:38, , 3F
05/01 18:38, 3F
推
05/01 18:56, , 4F
05/01 18:56, 4F