ul如何在div里水平居中？html/css
13个回答
展开全部
需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html，编写问题基础代码。
2、在index.html中的<ul>标签中，输入样式代码：text-align: center;list-style: none;。
3、浏览器运行index.html页面，此时ul成功在div中居中了。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
代码：
效果：
代码含义：
text-align:center 属性规定元素中的文本的水平对齐方式。
代码源件：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
body,div,ul{padding:0px;margin: 0px;}
</style>
</head>
<body>
<div style="width:400px;height:100px; background: #eee; text-align: center; text-align: -webkit-center;">
<ul style="width: 50px; height: 100px; background: #ccc;">
</ul>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
定义了宽度以后使用margin:0 auto;这个样式可以居中
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<style>
*{ padding:0; margin:0; list-style:none;}
.div{ width:500px; height:100px; border:1px solid #333;}
.div ul{ width:100px; height:50px; margin:0 auto; border:1px solid red;}
</style>
<body>
<div class="div">
<ul>1</ul>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
首先你的div要有宽，其次设置你的ul宽度然后加上margin: 0 auto;意思是上下间距是0，左右是自动，这样就会水平居中
例如：
<div class="box1">
<ul class="ul-si">
<li>标题</li>
<li>标题</li>
</ul>
</div>
css如下：
.box1{
width:800px;
margin:30px auto ;
}
.ul-si{
width: 300px;
margin: 0 auto;
}
例如：
<div class="box1">
<ul class="ul-si">
<li>标题</li>
<li>标题</li>
</ul>
</div>
css如下：
.box1{
width:800px;
margin:30px auto ;
}
.ul-si{
width: 300px;
margin: 0 auto;
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<div style="width:200px; border:1px #f00 solid; padding:10px;">
<ul style="width:100px; margin:0 auto; border:1px #00f solid;">
<li>123</li><li>123</li>
</ul>
</div>
起作用的就是width:100px; margin:0 auto;
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（11）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
