为了账号安全,请及时绑定邮箱和手机立即绑定

用了float:left又用position:relative。为什么?

用了float:left又用position:relative。为什么?

安之以祖古 2016-05-29 23:52:19
HTML+CSS基础课程中第15-5课中,div的float:left起的什么作用?li的float:left又起什么作用?为什么不直接使用display:inline-block?下面附上原代码<!DOCTYPE HTML><html><head><meta charset="utf-8"><title>不定宽块状元素水平居中</title><style>.container{    float:left; position:relative; left:50%}.container ul{ list-style:none; margin:0; padding:0; position:relative; left:-50%;}.container li{float:left;display:inline;margin-right:8px;}</style></head><body><div class="container"> <ul>    <li><a href="#">1</a></li>        <li><a href="#">2</a></li>        <li><a href="#">3</a></li>    </ul></div></body></html>
查看完整描述

1 回答

?
陌卍言

TA贡献35条经验 获得超17个赞

虽然不知道你在说什么,但是我可以告诉你原理,由于父元素不定宽,是由里面的元素撑开的,这个时候你给父元素浮动,然后相对左位移50%的时候,父元素左边界刚好居中,然后给子元素一个相对父元素的-50%左位移,这个时候子元素就会整体看起来居中,关键点是:父元素的宽度是等于子元素,是由子元素撑开的

查看完整回答
反对 回复 2016-06-01
  • 1 回答
  • 0 关注
  • 1250 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信