css圖片居中不了（css圖片居中）

大家好，我是小夏，我來為大家解答以上問題。css圖片居中不了，css圖片居中很多人還不知道，現在讓我們一起來看看吧！

1、LZ元旦快樂啊.....

2、LZ真有心，在元旦居然問如此復雜的問題。不過LZ問到了，我就說一種我個人用的方法。

3、水平居中很簡單，垂直居中就很困難，網上方法很多，不過都存在這樣那樣的兼容性問題，要么就要引入一些其他元素。考慮到后期圖片自動縮放，外容器浮動等等因素，然后只利用代碼，不引入其他元素。于是我在網上思路的基礎上，自己寫了下面的方法。

4、CSS部分：

5、*{padding:0px;margin:0px;}

6、.conn{width:500px;height:500px;border:1px solid #000;text-align:center;}/*好懂吧，寬高定義，文本居中。*/

7、.imgmid{display:inline-block;*display:inline;*zoom:1;height:100%;width:1px;margin-left:-1px;vertical-align:middle}/*這個LZ自己研究研究，我定義了一個高100%的塊元素用來對齊img*/

8、.conn img{width:400px;height:400px;vertical-align:middle;}/*好懂吧，img元素寬高，然后垂直居中對齊。*/

9、html部分：

10、<div class="conn"><img src="2301idjiofsnlkwjie.jpg_min.jpg"><span class="imgmid"></span></div>

本文到此講解完畢了，希望對大家有幫助。