課程
/前端開發
/HTML/CSS
/十天精通CSS3
例子中x，y軸是不是反了
2018-07-29
源自：十天精通CSS3 8-4
正在回答
上面兩個解釋都有問題，position 50% 是相對于父級元素，這樣元素的左上角是在父級的中心點。translate -50% 是相對自己的寬高，這樣元素自己的中心點就和父級中心點重合，所以可以實現對父級居中。
left50%是頁面的50%，translate50%是自身寬度和高度的50%
left50%讓元素往右邊移了50%，translate(-50%,-50%)又讓元素左移了50%，所以沒反呢
舉報
本課程為CSS3入門教程，深刻詳解CSS3知識讓網頁穿上絢麗裝備
3 回答translate 用%？？？
2 回答item的translate??????????
1 回答translate的-50%,-50%
4 回答translate 和 position的區別
1 回答translate水平垂直居中
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2020-12-22
上面兩個解釋都有問題，position 50% 是相對于父級元素，這樣元素的左上角是在父級的中心點。translate -50% 是相對自己的寬高，這樣元素自己的中心點就和父級中心點重合，所以可以實現對父級居中。
2019-08-14
left50%是頁面的50%，translate50%是自身寬度和高度的50%
2018-07-30
left50%讓元素往右邊移了50%，translate(-50%,-50%)又讓元素左移了50%，所以沒反呢