                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /初识HTML(5)+CSS(3)-升级版

CSS样式

.container ul{

list-style:none;

margin:0;

padding:0;

position:relative;

left:-50%;

}

left：-50%是什么意思？

默默竹

2016-08-16

源自：初识HTML(5)+CSS(3)-升级版 15-7

关注问题我要回答

945

操作

收起

5 回答

qq_叶心_03786519 回答被采纳 +3 积分
2016-08-16

这个left:-50%是相对ul的父级元素container来说的，就是向左偏移相当于container的一半，是以container的左边界为基准，你可以借助画图来理解

0 回复有任何疑惑可以回复我~

收起回答

默默竹提问者

非常感谢！

2016-09-19 回复有任何疑惑可以回复我~

皮囊人
2016-09-26

我刚看到这也有点晕，现在明白了。left和right都是指的是子类的左右边，+和-分别代表右移和左。left：-50%就是指子类的左边界左移50%。

0 回复有任何疑惑可以回复我~

收起回答

颖_Cheung
2016-09-18

上面说left:-50%是相对ul的父级元素container来说的，向左偏移container的一半，才是对的，目测，又要重新理解了

0 回复有任何疑惑可以回复我~

收起回答

颖_Cheung
2016-09-18

个人理解（仅是对这题的理解）。container的css代码就是把container这个盒子最左边对页面的中间，ul的css代码就是让container和ul无缝隙。现在ul的位置是：左边界对准页面的中间线。它是用的ralative,就是相对ul现在的位置移动。left:-50%;就是把ul这个盒子分成两半，一起往左边移动一半的距离。ul这个盒子里面装的是li，li有好大，ul就有好大。它设置了li元素是内联滚动的，就是从左到右依次排列，不管它多长，ul都是往左移动它的一半。

0 回复有任何疑惑可以回复我~

收起回答