css ul列表里的li标签无法垂直居中？
<title>无标题文档</title><styletype="text/css"><!--*{margin:0px;padding:0px;}ul{text-align...
<title>无标题文档</title>
<style type="text/css">
<!--
*{margin:0px; padding:0px;}
ul{text-align:center; width:980px;}
li {list-style-type:none; float:left; width:100px; height:45px; line-height:45px;}
-->
</style>
</head>
<body>
<ul>
<li>测试1</li>
<li>测试2</li>
<li>测试3</li>
<li>测试4</li>
</ul>
</body>
</html> 展开
<style type="text/css">
<!--
*{margin:0px; padding:0px;}
ul{text-align:center; width:980px;}
li {list-style-type:none; float:left; width:100px; height:45px; line-height:45px;}
-->
</style>
</head>
<body>
<ul>
<li>测试1</li>
<li>测试2</li>
<li>测试3</li>
<li>测试4</li>
</ul>
</body>
</html> 展开
2个回答
展开全部
<title>无标题文档</title>
<style type="text/css">
<!--
*{margin:0px; padding:0px;}
html,body{ height:100%}
ul{text-align:center; width:980px; border:1px solid; position: absolute; left:50%; top:50%; margin-left:-490px; margin-top:-22.5px}
li {list-style-type:none; float:left; width:100px; height:45px; line-height:45px;}
-->
</style>
</head>
<body>
<ul>
<li>测试1</li>
<li>测试2</li>
<li>测试3</li>
<li>测试4</li>
</ul>
<div style="clear:both"></div>
</body>
</html>
思路： 一。你的代码LI是浮动在UL外面的 必须在UL后加上一个
<div style="clear:both"></div>来清除浮动 也就是闭合ul
二。设置 position: absolute; left:50%; top:50%; margin-left:-490px; margin-top:-22.5px
这是一种简单的定位方法 固定UL在游览器中的位置
<style type="text/css">
<!--
*{margin:0px; padding:0px;}
html,body{ height:100%}
ul{text-align:center; width:980px; border:1px solid; position: absolute; left:50%; top:50%; margin-left:-490px; margin-top:-22.5px}
li {list-style-type:none; float:left; width:100px; height:45px; line-height:45px;}
-->
</style>
</head>
<body>
<ul>
<li>测试1</li>
<li>测试2</li>
<li>测试3</li>
<li>测试4</li>
</ul>
<div style="clear:both"></div>
</body>
</html>
思路： 一。你的代码LI是浮动在UL外面的 必须在UL后加上一个
<div style="clear:both"></div>来清除浮动 也就是闭合ul
二。设置 position: absolute; left:50%; top:50%; margin-left:-490px; margin-top:-22.5px
这是一种简单的定位方法 固定UL在游览器中的位置
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
