该死的网上资料,尼玛,很多瞎搞,碰运气。现拿一例子做讲解,与各位分享:
重点(两个):
1、display:inline_block 与display:block不同,inline-block是行内块,受上层限制。
2、就是在外面包一个div,然后用text-align居中。
<style>
.devPhoto{
display: block;
1000px;
}
.c_menu li{
float: left;
}
.c_menu{
display: inline-block;
}
.c_menu a{
padding: 0 20px;
}
.devList{
margin: 20px;
text-align:center;
overflow:hidden;
}
.hide_left{
background-color: #0F0D0D;
display: inline-block;
height: 12px;
1px;
overflow: hidden;
}
</style>
<div class="devList" >
<ul class="c_menu">
<li>
<a>大会首页</a><span class="hide_left"></span>
</li>
<li>
<a>大会详情</a><span class="hide_left"></span>
</li>
<li>
<a>新闻报道</a><span class="hide_left"></span>
</li>
</ul>
</div>
参考:http://blog.163.com/hongshaoguoguo@126/blog/static/1804698120125625634853/