課程
/前端開發
/HTML/CSS
/十天精通CSS3
img.bg為什么要設置left：50%呢 如果把left：50%刪了，圖片就不能正常顯示了，為啥
2017-08-21
源自：十天精通CSS3 7-8
正在回答
position：fixed，left:50%是絕對定位，這個50%是相對于window而言的，也就是瀏覽器窗口。而translate：-50%，代表將元素向左移動50%長度，這個50%是相對元素自身而言的。這兩個語句配合起來，可以使元素居中。如果你單獨刪除一個，比如left:50%,就只剩下元素向左移動50%的效果了，所以不能正常顯示。不懂得話建議你去看看css定位的知識,以及各種居中效果如何實現的
我把它們注釋了，有動作啊。只是動作在中間執行了，例如旋轉在中間旋轉了。而不是在left:50%的地方旋轉了，再tranlate(-50%)。
你可以下載它的參考代碼看看。還有，參考代碼的html中的類bg與其它類之間少了空格，要改一下。
因為設置了left:50%;
下面還設置了translate(-50%)，讓它回正left:0%的位置啊。
你可以同時把這兩個都注釋掉。
這樣后面的動作位置就會變化
可樂要加冰Xx 提問者
舉報
本課程為CSS3入門教程，深刻詳解CSS3知識讓網頁穿上絢麗裝備
2 回答圖片的背景
1 回答設置背景圖片切換
3 回答背景圖片顯示不齊全
3 回答關于背景圖片的探討
2 回答背景圖片的百分比問題
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2017-09-11
position：fixed，left:50%是絕對定位，這個50%是相對于window而言的，也就是瀏覽器窗口。而translate：-50%，代表將元素向左移動50%長度，這個50%是相對元素自身而言的。這兩個語句配合起來，可以使元素居中。如果你單獨刪除一個，比如left:50%,就只剩下元素向左移動50%的效果了，所以不能正常顯示。不懂得話建議你去看看css定位的知識,以及各種居中效果如何實現的
2017-08-23
我把它們注釋了，有動作啊。只是動作在中間執行了，例如旋轉在中間旋轉了。而不是在left:50%的地方旋轉了，再tranlate(-50%)。
你可以下載它的參考代碼看看。還有，參考代碼的html中的類bg與其它類之間少了空格，要改一下。
2017-08-22
因為設置了left:50%;
下面還設置了translate(-50%)，讓它回正left:0%的位置啊。
你可以同時把這兩個都注釋掉。
這樣后面的動作位置就會變化