首页 文章

图像在响应式设计中调整为100%

提问于
浏览
0

我有一个WordPress网站,其中包含二十二个儿童主题 . 它有一个红狮酒店的图像到这个页面的底部:http://ranchocordovaeventscenter.com/partner-hotels/

它会自动调整大小,以填充它所在的表的100% . 我尝试将它添加到表外,它也做同样的事情 . 如果我改变图像它会做同样的事情 .

这是HTML:

<a target="_blank" href="http://www.redlion.com/our-hotels/california/rancho-cordova/">
<img class="size-full wp-image-423 alignleft" width="150" height="169" src="http://ranchocordovaeventscenter.com/wp-content/uploads/2013/01/redlion.jpg" alt="Red Lion Hotel" title="Red Lion Hotel">
</a>

适用的CSS:

img {
    border: 0 none;
    max-width: 540px;
    width: 100%;
}

我知道我将它设置为宽度:100%但是当网站为较小的设备调整大小时,更大的图像将保留在屏幕内 .

任何提示将不胜感激,谢谢!

1 回答

  • 0

    将其从宽度更改为最大宽度:

    img {
        max-width: 100%;
    }
    

    这应该够了吧 .

相关问题