javascript - 可缩放背景 HTML CSS Javascript

标签 javascript html css background-image

有谁知道有一种方法可以使背景图像缩放到它所在的浏览器窗口的尺寸?我知道 CSS3 允许背景宽度,但我需要更兼容的东西。

非常感谢,

埃利奥特

最佳答案

您不能使用 background-image 来做到这一点,因为它不支持调整大小。您必须通过放置一个在两个方向上 100% 拉伸(stretch)的 img 标签来伪造它,并使用绝对定位和 z-index 将其定位在您的内容后面。这样的事情应该有效:

<body>
    <img class="bgimage" src="bgimage.jpg" />
    <div id="content">
        Your content here...
    </div>

在 CSS 中:

html, body {
    min-height: 100%;
}

.bgimage {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

还没有测试过,但这至少应该给你一些入门。

关于javascript - 可缩放背景 HTML CSS Javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2200391/

相关文章:

javascript - 当我使用 chrome 移动版时,div on.click 事件不起作用

php - 使用 css 和空白行设置 php echo 样式

Javascript - 改进对象集合的排序

javascript - 从数组中删除虚假值

javascript - 为 Android 和 iPhone 应用不同的样式表

java - 如何使用纳肖恩?它如何提高性能?

javascript - 我如何验证来自 html5 数据列表的输入?

html - float div 不会扩展容器

javascript - 变量传递不起作用 - 值未定义

html - 带有文本区域的 Div 不停留在页面内