css 图片在div中居中

目的：为了让ID为navicatorbar的div中的图片实现居中

htm结构：

1 <div data-options="region:'north',border:false" style="height: 10%;">
2     <div id="navicatorbar" style="height: 100%">
3         <i></i> <img src="../img/ep-logo.png"
4             style="width: 12%; height: auto%; vertical-align: middle" />
5     </div>
6 </div>

css样式:

 1 #navicatorbar{
 2     background-image:url("../img/nav.jpg");
 3     background-size:100% 100%; 
 4      -moz-background-size:100% 100%;
 5      background-attachment: fixed;
 6      text-align:center;
 7 }
 8 i{
 9     display:inline-block;
10     width:0;
11     height:100%;
12     vertical-align:middle;
13 }

其中：text-align:center;为了作用居中；vertical-align:middle;为了上下居中

 

posted @ 2021-05-22 22:55  啄木鸟伍迪  阅读(244)  评论(0)    收藏  举报
//火箭 GenerateContentList();