前端开发中img图片大小大于div标签大小设置图片居中的方法


如果图片的宽度大于父元素的宽度,不能使用margin: 0 auto;或text-align:center;来使图片居中

如果图片的宽度大于父元素的宽度,可以使用定位流使图片居中

在img标签css中写:

position:absolute;

left:50%;

margin-left:- 图片宽度 px;

定位流的弊端也很明显 ,写三行代码,而且必须知道图片的宽度;

第二种方法:

直接写margin:0 -100% ;父元素必须写text-align:center;
就可以了

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,806评论 1 92
  • 收听音频,戳链接,旧号itclan已暂停使用,欢迎关注微信itclanCoder公众号可收听更多音频 前言 关于网...
    itclanCoder阅读 8,214评论 3 30
  • 一 外部式css样式 (也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以“.css...
    KunMitnic阅读 962评论 0 1
  • CSS格式化排版 1、字体 我们可以使用css样式为网页中的文字设置字体、字号、颜色等样式属性。下面我们来看一个例...
    张文靖同学阅读 1,310评论 0 3
  • 十月二十二号要参加自学考试,报了两门,《外国文学作品选》和《教育学》。 今年四月份报了两门,已经通过,这个专业总共...
    唐小糖1982阅读 629评论 0 2