我正在使用一个程序,该程序允许我在表格的单元格内添加内容。但是,所有类型的内容都是允许的,因此我添加了对样式表的引用,允许我重新标记应用程序。
该应用程序通过我们组织内部的 Web 浏览器访问,主要使用 IE8 和 IE10,以及使用 IE7 模式的应用程序界面。因此,它必须在各种屏幕分辨率下与所有这些浏览器模式兼容。
我想要完成的是向一个从未有过的页面添加一个标题图形。布局是这样的
<table width="60%">
<tbody>
<tr>
<td>
Here is my content
</td>
</tr>
</tbody>
</table>
Rest of page content here
我想要一个标题图片覆盖浏览器的顶部,所以我插入了一张图片
在 HTML 中我可以输入
<img src="/pathtoimage.png" class="newhead">
CSS
.newhead
{
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: -100;
}
由于图形从文档流中移除,页面的其余内容希望从图形后面开始。
由于图形会根据浏览器大小改变高度(根据宽度按比例调整),因此内容需要向下移动相同的量。
任何有关如何最好地完成此任务的建议都将受到赞赏。我一直在绞尽脑汁想办法做到这一点,让它在 IE7 模式下工作(我知道,我知道)
我一直在尝试的是使用一个透明图像,它是标题图形宽度的 60%(相同高度)——这样它会随着标题图形按比例调整大小)但要让它正确填充表格,或者保持 60%,或按计划做任何事情已被证明行不通。
再次感谢您的帮助
最佳答案
为什么要把位置设为绝对?您可以更改页眉的一侧并将其向下推至您想要的任何大小。
.newhead
{
width: 100%;
display: block;
}
如果您想摆脱默认填充:
body
{
margin: 0;
padding: 0;
}
关于html - 向下移动页面以允许标题图形,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21836626/