删除博客中的自动调整大小

Question

我正在为我的博主博客使用一个模板，其中的图像设置为自动调整大小以适应整个宽度。因此，无论我将照片左对齐或右对齐或调整照片大小，它们始终显示为全宽。但是，如果我将照片包含在以下代码中，则有一种情况我可以覆盖它：

<a href="##" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"><img alt="" border="0" src="##" id="BLOGGER_PHOTO_ID_5428874514942438946" style="cursor: hand; cursor: pointer; float: right; height: 240px; margin: 0 0 10px 10px; width: 320px;" /></a>

但是每次我创建 post 我都必须为每张照片手动添加这个，因为博主会自动为右对齐的照片添加这段代码：

<a href="##" imageanchor="1" style="clear: right; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" src="##" height="240" width="320" /></a>

但是上面的代码不行，也是前面post的问题。我在我的模板的 xml 文件中找到了一部分，我认为这部分可以是设置图像大小的部分，这里是：

img{max-width:100%;width:auto;height:auto;vertical-align:middle;border:0;-ms-interpolation-mode:bicubic}

虽然我不确定它是否真的是那个部分，我不知道我是否可以改变它，那也是因为我不擅长 xml 代码。

有什么办法可以解决这个问题吗？谢谢

Answer 1

img{max-width:100%;width:auto;height:auto;vertical-align:middle;border:0;-ms-interpolation-mode:bicubic}

以上部分，我认为可能是解决方案，实际上不是。在浏览代码时，我检查了所有可能与博客文章对应的宽度值，并找到了这部分：

.post h1 {
padding: 0 10px;
}
.post img{max-width:100%;width: 100%;
height: auto;
margin-left: -13px;}
.entry-container {
background: #FFF;
position: relative;
margin-bottom: -10px;
color: #444;
font-size: 14px;
padding: 30px 40px 30px 40px;
line-height: 26px;
}

这里，width: 100% 是强制所有图像全宽显示的部分。我的第一个解决方案是将其设置为 width: auto 但它没有帮助。认为在 xml 文件中指定宽度或高度是不必要的，所以我继续删除宽度和高度，使最终代码如下：

.post h1 {
padding: 0 10px;
}
.post img{max-width:100%;
margin-left: -13px;}
.entry-container {
background: #FFF;
position: relative;
margin-bottom: -10px;
color: #444;
font-size: 14px;
padding: 30px 40px 30px 40px;
line-height: 26px;
}

现在一切正常，所有图像都恢复到它们设置的原始尺寸。

P.S。在这个代码的正下方还有另一个代码，它完全相同，但它控制静态页面，我也以同样的方式修复它。

Answer 2

我遇到了同样的问题。我按照@H.Aziz.

的建议找到了img class

.post-image img{
    max-width:100%;
    height:auto;
}

但是根本没有要删除的宽度属性。我实现目标的方法是改变 max-width:

.post-image img{
    max-width:50%;
    height:auto;
 }

这将图像的大小减小到合适的大小。但是，出现的新问题是图像向左移动。为了解决这个问题，我做了最后的改变：

.post-image img{
    display:block;
    margin-left:auto;
    margin-right:auto;
    max-width:50%;
    height:auto;
}

将图像置于父图像中心的常用技巧 div 是将其放入自己的块中并对其应用边距属性。

删除博客中的自动调整大小

Remove auto-resize in blogger

css

xml

blogger

image