【问题标题】:Center an image inside a div. Horizontally and vertically [closed]将图像居中放在 div 中。水平和垂直[关闭]
【发布时间】:2018-09-08 05:14:38
【问题描述】:

我想这个问题已经被问过很多次了,但是我已经在网上搜索了一整天,找不到一个好的解决方案。我想在 div 中居中图像,使其看起来像一个框架。我有不同尺寸的图像,有些是纵向的,有些是横向的。我希望它们水平和垂直居中,并且如果尺寸较大,它不会溢出容器。现在我已经阅读了有关 div 与表格设计的内容,但说真的,现在我只想完成这项工作,因此任何解决方案都将不胜感激。

【问题讨论】:

标签: javascript html css


【解决方案1】:

查看演示 - http://jsfiddle.net/x6jDu/

table-cell 支持 IE8+

【讨论】:

    【解决方案2】:

    您可以通过点击下面的演示链接来实现它:

    演示 http://jsfiddle.net/rathoreahsan/99BXT/

    注意:

    1. 缺点:使用display:table-cell 将无法在 Internet Explorer 8 浏览器下运行,除此之外的其他浏览器都可以。 优点:它也可以通过使用固定宽度和固定高度来工作。

    2. 优点:使用display:block 将适用于所有浏览器。 缺点 使用固定宽度和固定高度将不起作用。但是您可以使用与本演示中提到的相同的padding (上、右、下、左)来管理它

    【讨论】:

      猜你喜欢
      • 2017-08-04
      • 2021-06-30
      • 2012-05-04
      • 1970-01-01
      • 2020-09-16
      • 2013-05-18
      • 2015-08-29
      • 1970-01-01
      相关资源
      最近更新 更多