Question

我需要使用javascript缩小div背景图像中保存的图像。对于那个四边形有圆角的图像。

可以在javascript中使用吗？

有什么建议吗？

Answer 1

您无法使用JS调整背景大小。

你可以将图像分割成4个角落图像并嵌套div以显示所有图像：

<div style="background:url(tl.jpg) top left no-repeat">
    <div style="background:url(tr.jpg) top right no-repeat">
        <div style="background:url(bl.jpg) bottom left no-repeat">
            <div style="background:url(br.jpg) bottom right no-repeat">
                content
            </div>
        </div>
    </div>
</div>

当然，如果div只在一个轴上生长，你可以简化它：

<div style="background:url(top.jpg) top no-repeat">
    <div style="background:url(bottom.jpg) bottom no-repeat">
        content
    </div>
</div>

Answer 2

CSS不支持调整背景图像的大小。

如果您只是寻找圆角，可以使用各种HTML，CSS和Javascript组合的解决方案。

Google: Rounded Corners

Answer 3

CSS 3具有background-size属性，可以让你这样做，但大多数浏览器都不支持它。

Answer 4

大多数现代浏览器都可以让您绕过元素的角落而无需借助背景图像。查看以下CSS样式......

-moz-border-radius:4px; 
border-radius:4px; 
-webkit-border-radius:4px;

每个都会给你一个4像素的半径。 Mozilla浏览器中的第一个（例如Firefox），第二个是较新的css3浏览器，也是Safari等人的最后一个浏览器。

使用javascript缩小图像

4 个答案: