Heim >Web-Frontend >HTML-Tutorial >css控制div中图片垂直居中_html/css_WEB-ITnose

css控制div中图片垂直居中_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:28:361379Durchsuche

 .box {        /*非IE的主流浏览器识别的垂直居中的方法*/        display: table-cell;        vertical-align:middle;/*设置水平居中*/text-align:center;/* 针对IE的Hack */*display: block;*font-size: 175px;/*约为高度的0.873,200*0.873 约为175*/*font-family:Arial;/*防止非utf-8引起的hack失效问题,如gbk编码*/width:200px;height:200px;border: 1px solid #eee;}.box img {/*设置图片垂直居中*/vertical-align:middle;}<div class="box"><img  src="http://pics.taobao.com/bao/album/promotion/taoscars_180x95_071112_sr.jpg" / alt="css控制div中图片垂直居中_html/css_WEB-ITnose" ></div>

摘自:http://www.planabc.net/2008/05/26/img_vertical_center_solution/?

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn