gpt4 book ai didi

html - 在 div + 表格中包含内容的背景拉伸(stretch)

转载 作者:太空宇宙 更新时间:2023-11-04 04:39:19 24 4
gpt4 key购买 nike

我想在 div 和表格中放置一个覆盖整个窗口和内容的拉伸(stretch)背景图像。

这段代码工作正常:

<!doctype html>
<html>
<head>
<title>Background to fit screen</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Imagetoolbar" content="no">

<style type="text/css">
/* pushes the page to the full capacity of the viewing area */
html {height:100%;}
body {height:100%; margin:0; padding:0;}
/* prepares the background image to full capacity of the viewing area */
#bg {position:fixed; top:0; left:0; width:100%; height:100%;}
/* places the content ontop of the background image */
#content {position:relative; z-index:1;}
</style>
</head>

<body>
<div id="bg"><img src="../images/background.jpg" width="100%" height="100%" alt=""></div>
<div id="content">

<table>
<tr>
<td>
<img src="images/1.jpg">
</td>
<td>
<img src="images/2.jpg">
</td>
</tr>
</table>

</div>
</body>
</html>

问题是表格单元格中图像之间的间距!一旦你有一张包含大量图像的非常大的 table ,那就很糟糕了。

请帮忙!

最佳答案

对于你的表格 div,你可以修改它并添加 background-size: 100% 100%;

<div id ="bg" style="background-image: url(../image/background.jpg); background-size: 100% 100%;">
<table>
<!--table stuff-->
</table>
</div>

显然,您希望将我的内联 css 提取到您的 css 文件中,但这给了您一般的想法。对于您的 IE 6 版本,由于它不支持 CSS3,您可能只想使用背景颜色。

关于html - 在 div + 表格中包含内容的背景拉伸(stretch),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15770667/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com