分享更有价值
被信任是一种快乐

怎样使div中的图片水平垂直居中

文章页正文上

怎样使div中的图片水平垂直居中?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。body结构
方法一:
将display设置成table-cell,然后水平居中设置text-align为center,垂直居中设置vertical-align为middle。结果如下图所示:
方法二:
通过position定位来实现。将p免费云主机、域名设置成相对定位relative,将img设置成绝对定位absolute,left:50%,top:50%,此时图片的左上角位于p的中心,要是图片的中心位于p的中心,就需要将图片向上移动图片高度的一半,并向左移动图片宽度的一半。结果如下图所示:
方法三:可以用在不清楚图片图片或元素的真实宽高情况下
还是通过position定位来实现。将p设置成相对定位relative,将img设置成绝对定位absolute,left:50%,top:50%,此时图片的左上角位于p的中心,要是图片的中心位于p的中心,就需要将图片向上移动图片高度的一半,并向左移动图片宽度的一半,如果不知道元素的宽高,可以用transform: translate(-50%,-50%);方法四:方法五:弹性布局flex关于怎样使div中的图片水平垂直居中问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注云技术行业资讯频道了解更多相关知识。

相关推荐: Python中self的四个秘密分别是什么

这篇文章给大家介绍Python中self的四个秘密分别是什么,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。毫无疑问,几乎每一门Python课程都有一个关于(class)类的讲座——面向对象编程语言的基本构建模块之一。当您通过一些示例学习它…

文章页内容下
赞(0) 打赏
版权声明:本站采用知识共享、学习交流,不允许用于商业用途;文章由发布者自行承担一切责任,与本站无关。
文章页正文下
文章页评论上

云服务器、web空间可免费试用

宝塔面板主机、支持php,mysql等,SSL部署;安全高速企业专供99.999%稳定,另有高防主机、不限制内容等类型,具体可咨询QQ:360163164,Tel同微信:18905205712

主机选购导航云服务器试用

登录

找回密码

注册