图像“显示:阻止”的缺点?

时间:2012-10-30 18:38:55

标签: css image css-float positioning responsive-design

img从内联块元素转换为具有display: block CSS属性的块对象是否有任何缺点?

大多数时候,我希望它们是block元素。我失去了任何有用的inline方面? (也许我没有看到some有用吗?)

默认情况下是否应将所有图像转换为block个元素?为什么根据规范它们是内联块元素?

P.S。我通过定位和安排考虑布局问题。浮动和周围元素。

4 个答案:

答案 0 :(得分:14)

考虑到一个块会在换行后强制执行任何操作,只有一种情况会很糟糕:

如果您打算在它旁边有另一个内联元素(文本,另一个图像,范围等)

答案 1 :(得分:1)

img { display: block; }放入CSS并忘掉它。在非常罕见的情况下,你需要一些不同的东西写一个例外。

答案 2 :(得分:1)

有一个缺点: 如果您计划将图像水平居中,请使用" text-align:center"到父元素,您不能将图像显示为块或内联块。

答案 3 :(得分:0)

发现了一个用于块显示的hack:" block"。

我有这个图像和我想要的wavesurfer音频波形作为内联。 但是,显示:" block&#34 ;;在waveurfer的js中不允许它。

我所做的是,在本地保存了此cdn文件,并将显示更改为内嵌,将位置更改为绝对,从而解决了我的问题。应该在创建wave元素的地方完成更改。

希望这有助于某人。感谢waveurfer创造者为这样一个惊人的js。