Question

我正在尝试在博客的移动主题中制作图像以适应移动屏幕。我指的是文章中的图像，而不是标题等主题的一部分。

我遇到的一个问题是博客软件会自动添加像素的高度和宽度。这就是源代码的样子：

<div class="leftbox"><img src=".mysite.net/blog/media/Photo/Indian_tourists.jpg" width="400" height="267" alt="Indian tourists" title="Indian tourists" /></div>

我想使用css覆盖最大宽度为100％的图像代码，以便在图像大于屏幕尺寸时，可以修复它。

有人告诉我将以下代码放在移动主题css文件的底部。

.post_content img {
height: auto !important;
max-width: 100% !important;
}

我尝试了这段代码，但不幸的是它没有成功。有人可以请帮帮我。

Answer 1

如果您的div类是leftbox，那么您可以在css文件中使用以下代码

.leftbox img {
   height: auto !important;
   max-width: 100% !important;
}

Answer 2

试试这个

 <div class="leftbox"><img src=".mysite.net/blog/media/Photo/Indian_tourists.jpg"     width="400" height="267" alt="Indian tourists" title="Indian tourists" /></div>

CSS

 .leftbox img
  {   height: auto !important;
     width: 100% !important;
  }

或添加此css文件

  img[style] {
    height:auto !important;
    max-width:100% !important;
  }

用CSS覆盖图像大小

2 个答案: