You are here

css html 如何将图片img标签水平居中垂直居中和水平垂直居中

星期二, 2017-07-11 11:03 — adminshiping1

css html 如何将图片img标签水平居中垂直居中和水平垂直居中 10

children117cl | 浏览 168166 次

推荐于2016-05-24 04:30:02最佳答案

水平居中的话就在img所在的标签设置text-align:center
垂直居中的话就在img上设置vertical-align:middle
至于水平垂直居中？这的问题与上面的已经重复了
例如：
<div style="text-align:center; width:100px; height:40px;"><img src="图片" style="vertical-align:middle;" width="16" height="16" /></div>

 
追问

请允许我追问下：如果在设置了最大宽度和最大高度的情况下，同时需要水平垂直居中，应该如何处理~？
 
追答

无论是最大还是最小宽度高度，并不会影响图片的水平和垂直方向居中；
有一个要提醒下你，如果你div内插入了img图片后就尽量别插入其他元素，比如文字或者其他标签，否则img可能会不是100%的垂直居中，可能会偏上或者偏下一点点距离

其实还有其他方法垂直居中的，那就是设为背景图片并设定图片一直处于水平和垂直方向居中即可，这个也是无论div宽度高度是多少都居中的
 background:url(图片) center no-repeat;
 
追问

帮忙看看我的问题补充，谢谢~

来自 https://zhidao.baidu.com/question/537179073.html

普通分类: