CSS中使用ul和li实现居中

 我来答
文代桃汗可
2020-05-16 · TA获得超过2.9万个赞
知道大有可为答主
回答量:1.1万
采纳率:32%
帮助的人:605万
展开全部
通常情况li上加float:left是为了让标签并排显示,如果不加的话默认就是换行的
而上面加position:
relative;
left:
-50%;这个可能是写代码的人想让每个标签都向左移动一半的位置,有点像是书页或者纸张层叠的效果,也许可以不用相对定位来处理,可以加例如margin-left:-100px;一样可以达到效果,只不过这样需要把li的宽度固定,要不然就效果不太好了
再来说一下让标签居中的样式好了,其实上面加的
有点问题,加了position:
relative;
left:
50%;就没必要加
float:left;
了而且应该是无效的
还有就是position:
relative;
left:
50%;并不能达到真正居中的效果,因为这样加只是以标签的左边线为中心,实质效果是标签是偏右的,如果非要让标签用position来实现居中的话,那么就应该是下面这种样式,例如:
你把这段标签直接放入body中试试就能看到了,div是绝对处于浏览器的居中位置
不过建议如果你想让标签居中,还是使用常用方法吧margin:0
auto;,尽量少用position属性来设定,
书香学编程
2021-01-10 · 贡献了超过775个回答
知道答主
回答量:775
采纳率:25%
帮助的人:54.7万
展开全部

Vue实践-CSS样式position/display/float属性对比使用

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式