如何使图像响应，最大宽度不起作用

我正在尝试使图像响应并且max-width由于某种原因而不起作用。在不到499像素的情况下，图像在右侧被切断。网址：http://boasish.com 如何使图像响应，最大宽度不起作用

/*** Images */ 
img { 
    height: auto; 
    max-width: 100%; 
}

来源

2014-10-26 k65

该网站上的图片是响应式的。 – rfj001 2014-10-26 20:38:16

你使用的CSS或最大宽度：500px？如果你使用它，在你的问题中，它会起作用。 – Christina 2014-10-26 20:41:32

@ rfj001低于499px时，图像在右侧被切断。 – k65 2014-10-26 20:42:18

一些你的div得到width: 510px财产。例如你的<div id="attachment_2469">。我不确定你是否在那里使用一些脚本，但是尝试删除这个属性。如果你不能，你可能想使用!important，这是不好的做法。

试试这个代码：

.wp-caption { 
    width:100% !important; 
} 

a img { 
    width:100% // sets responsive width 
}

Remeber，如果你不使用!important

来源

2014-10-26 20:47:52 Kamil

尝试将该类添加到img标签：

.img-responsive { 
    width: 100%; 
    display: block; 
    height: auto; 
}

来源

2014-10-26 20:41:29

在小于499像素的情况下，图像仍然在右侧被切断。 – k65 2014-10-26 20:47:01

@ k65首先为所有，与类内容的主要标记有此css： .content { \t宽度：500px; \t max-width：100％; } 将其转换为： .content { \t max-width：500px; \t宽度：100％; } 随着JS你正在申请类“wp-caption aligncenter”宽度：510px。它比父div更大。尝试将其设置为宽度：100％; – 2014-10-26 21:26:03

这个CSS类我通常使用：

/*makes an image responsive*/ 
.responsive-image{ 

    display: block; 
    height: auto; 
    max-width:100%; 
    width:100%; 

}

这里是一个链接小提琴我创建的：

http://jsfiddle.net/larryjoelane/ar6bwpgf/

来源

2014-10-26 20:51:57

如何使图像响应，最大宽度不起作用

回答

相关问题