課程
/前端開發(fā)
/HTML/CSS
/從 psd 到 html
設(shè)置margin:0 auto;也不起作用,banner圖不居中
2016-06-11
源自:從 psd 到 html 4-2
正在回答
我猜你應(yīng)該是沒在 reset.css 中設(shè)置 img{display:block}
不過沒設(shè)置也沒事,那img在默認css中就是inline元素了,這樣你就不要在index.css的img設(shè)置 margin:0 auto;了,你可以img的父級元素也就是index-banner-bg中設(shè)置text-align:center就好了嘛,因為text-align:center就是針對這種inline元素居中的嘛
我也是這個情況,不過不知道你是不是一樣。
我發(fā)現(xiàn)我的footer和header的寬度是1500px(我們設(shè)置的),但是index-banner的寬度是1349px,又進一步發(fā)現(xiàn)body的寬度也是1349px,即body的寬度<你設(shè)置的header和footer的寬度,所以我嘗試把body的寬度設(shè)置為1500px,就解決了。這個解決方法可能不正確,希望知道的人解釋解釋。我推斷這個可能是瀏覽器的原因,我用的是火狐和谷歌的瀏覽器。
如果你父級元素用了浮動的話,或者img 標簽沒有升級為display:block/inline-block;(包在圖片的外層元素是個行間元素)margin:0px auto是不起作用的:解決辦法:1:把圖片的外層元素設(shè)置為塊級元素,或者本身設(shè)置為display:block元素,在margin:0px auto;,若沒有升級為塊級元素,在外層,直接text-algin:center;也是可以的。2:或者用css3的盒模型可以解決:外層元素display:block/inline-block;(注意各個瀏覽器前面得加前綴:例如:谷歌:display:-webkit-block;等),box-pack:Center;
舉報
教你把PSD設(shè)計稿轉(zhuǎn)化成HTML,用案例來講解基本流程
1 回答為什么我的菜單會出現(xiàn)這種問題
3 回答為何切圖時,縮放比例不是按照100%來的,老師這樣任意的放大psd文檔,切出來的圖是會原搞的psd文檔有出入差別的啊
2 回答瀏覽器縮小,滾動橫向滾動條,頁面右邊出現(xiàn)白色
2 回答我按照老師講的方法切圖,可是發(fā)現(xiàn)切出的圖比psd上的要大,而且大小各不相同,這是怎么回事?
2 回答banner中的內(nèi)容放置不合適
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網(wǎng)安備11010802030151號
購課補貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動學習伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號
2016-07-07
我猜你應(yīng)該是沒在 reset.css 中設(shè)置 img{display:block}
不過沒設(shè)置也沒事,那img在默認css中就是inline元素了,這樣你就不要在index.css的img設(shè)置 margin:0 auto;了,你可以img的父級元素也就是index-banner-bg中設(shè)置text-align:center就好了嘛,因為text-align:center就是針對這種inline元素居中的嘛
2016-07-05
我也是這個情況,不過不知道你是不是一樣。
我發(fā)現(xiàn)我的footer和header的寬度是1500px(我們設(shè)置的),但是index-banner的寬度是1349px,又進一步發(fā)現(xiàn)body的寬度也是1349px,即body的寬度<你設(shè)置的header和footer的寬度,所以我嘗試把body的寬度設(shè)置為1500px,就解決了。這個解決方法可能不正確,希望知道的人解釋解釋。我推斷這個可能是瀏覽器的原因,我用的是火狐和谷歌的瀏覽器。
2016-06-11
如果你父級元素用了浮動的話,或者img 標簽沒有升級為display:block/inline-block;(包在圖片的外層元素是個行間元素)margin:0px auto是不起作用的:解決辦法:1:把圖片的外層元素設(shè)置為塊級元素,或者本身設(shè)置為display:block元素,在margin:0px auto;,若沒有升級為塊級元素,在外層,直接text-algin:center;也是可以的。2:或者用css3的盒模型可以解決:外層元素display:block/inline-block;(注意各個瀏覽器前面得加前綴:例如:谷歌:display:-webkit-block;等),box-pack:Center;