div css如何实现子DIV里的多个子DIV水平居中？
<divclass="find_center"><DIVid="find_button"><DIVclass="find_button_left"></DIV><DIVc...
<div class="find_center">
<DIV id="find_button">
<DIV class="find_button_left"></DIV>
<DIV class="find_button_center"><a href="#">查询查询查询查询查询查询查询</a></DIV>
<DIV class="find_button_right"></DIV>
</DIV>
<DIV id="find_button">
<DIV class="find_button_left"></DIV>
<DIV class="find_button_center"><a href="#">查询</a></DIV>
<DIV class="find_button_right"></DIV>
</DIV>
<DIV id="find_button">
<DIV class="find_button_left"></DIV>
<DIV class="find_button_center"><a href="#">查询查询查询查询查询查询</a></DIV>
<DIV class="find_button_right"></DIV>
</DIV>
</div>
我要实现3个find_button水平剧中
.find_center{
height: 25px;
}
.find_button{
height: 25px;
}
.find_button_left{
width: 9px;
height: 22px;
background-image:url(f01.jpg);
margin-left:10px;
float: left;
}
.find_button_center{
height: 17px;
background-image:url(f02.jpg);
float: left;
text-align: center;
padding-top:5px;
}
.find_button_center a {
font-size: 12px;
color: #fff;
text-decoration:none;
}
.find_button_center a:hover{
color:#000;
}
.find_button_right{
width: 9px;
height: 22px;
background-image:url(f03.jpg);
float: left;
} 展开
<DIV id="find_button">
<DIV class="find_button_left"></DIV>
<DIV class="find_button_center"><a href="#">查询查询查询查询查询查询查询</a></DIV>
<DIV class="find_button_right"></DIV>
</DIV>
<DIV id="find_button">
<DIV class="find_button_left"></DIV>
<DIV class="find_button_center"><a href="#">查询</a></DIV>
<DIV class="find_button_right"></DIV>
</DIV>
<DIV id="find_button">
<DIV class="find_button_left"></DIV>
<DIV class="find_button_center"><a href="#">查询查询查询查询查询查询</a></DIV>
<DIV class="find_button_right"></DIV>
</DIV>
</div>
我要实现3个find_button水平剧中
.find_center{
height: 25px;
}
.find_button{
height: 25px;
}
.find_button_left{
width: 9px;
height: 22px;
background-image:url(f01.jpg);
margin-left:10px;
float: left;
}
.find_button_center{
height: 17px;
background-image:url(f02.jpg);
float: left;
text-align: center;
padding-top:5px;
}
.find_button_center a {
font-size: 12px;
color: #fff;
text-decoration:none;
}
.find_button_center a:hover{
color:#000;
}
.find_button_right{
width: 9px;
height: 22px;
background-image:url(f03.jpg);
float: left;
} 展开
7个回答
展开全部
新建一个<div>容器，让它包含你的3个find_button，给它指明id,如：
<div id="center">
<!-- 这里是要居中的所有代码。-->
</div>
然后在css文件中给它定义外边距、宽、高等，如：
#center{margin:0 auto;width:500px;height:200px;background:#900;}
/*margin:0 auto;解决居中问题；width:500px;height:200px;指明宽和高；background:#900;设为红色背景以便看到效果。*/
<div id="center">
<!-- 这里是要居中的所有代码。-->
</div>
然后在css文件中给它定义外边距、宽、高等，如：
#center{margin:0 auto;width:500px;height:200px;background:#900;}
/*margin:0 auto;解决居中问题；width:500px;height:200px;指明宽和高；background:#900;设为红色背景以便看到效果。*/
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<style type="text/css">
.main{ height:100px; background:red; margin:0px auto; width:480px;
}
p{ text-align:center; width:500px; height:200px; background:yellow;}
</style>
<body>
<div class="main"></div>
<p>在中间</p>
</body>
效果图：
红色区域永远是水平居中的，无论浏览器宽度是多少的。
margin:0px auto;(记得设定这个div的宽度)
text-align:center;是用于文字的水平居中。
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你这个也太小题大作了吧、把你的find_center的高取消了、让它自动、然后再设text-align:center;
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
#find_button{
height: 25px;
width: 950px;
margin: 0 auto;/*需设置宽度才能居中,*/
text-align:center;/*如果无法兼容IE6,可以加上这句*/
}
height: 25px;
width: 950px;
margin: 0 auto;/*需设置宽度才能居中,*/
text-align:center;/*如果无法兼容IE6,可以加上这句*/
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
其实像这样的情况 我建议你不要用这么多div
开始三个还可以用div。到最里面的三个div的时候我建议还是用ul li的好。
而且也方便。
开始三个还可以用div。到最里面的三个div的时候我建议还是用ul li的好。
而且也方便。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（5）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
