Html 页面底部的额外空间_Html_Css_Space

Html 页面底部的额外空间

html css

Html 页面底部的额外空间,html,css,space,Html,Css,Space,出于某种原因，我的页面底部有大量额外的空白，我似乎无法摆脱。我不能在空间里放任何东西，也不能把它扔掉。我做了一些研究，我有一种预感，这与我的图像是相对的，但我仍然不能完全确定。如果我需要去掉位置：相对的，有人能告诉我如何放置不使用位置：绝对的或位置：相对的的图像吗 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitiona

出于某种原因，我的页面底部有大量额外的空白，我似乎无法摆脱。我不能在空间里放任何东西，也不能把它扔掉。我做了一些研究，我有一种预感，这与我的图像是相对的，但我仍然不能完全确定。如果我需要去掉

位置：相对的

，有人能告诉我如何放置不使用

位置：绝对的

或

位置：相对的

的图像吗

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="SDL.css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Home</title>
</head>

<body>
<center>
<img src="img/SDL 4 Final Recompress.jpg" height="283" style="position: relative;"/>
<br/>
<hr width="500"/>


<img src="img/Studio-Light_sxu1.png"         style="position: relative; top: -496px; left:  30px; z-index: 3; height: 200px;"/>
<img src="img/Studio-Light_sxu1 flipped.png" style="position: relative; top: -496px; left: 650px; z-index: 3; height: 200px;"/>

<embed
src="http://blip.tv/play/AwGUv2w"
type="application/x-shockwave-flash" width="669"
height="500" allowscriptaccess="always"
allowfullscreen="true" wmode="transparent" style="position:relative; z-index: 2; top:100px; left:-200px">
</embed>

<img src="img/Stage-Background.png" style="position: relative; z-index: 1; height: 680px; top:-500px"/>
</center>

<div id="nav">
<p>All Episodes</p>
<a>Contact</a>
<a>Facebook</a>
<a>Meet the Crew</a>
</div>





</body>
</html>


家



接触
脸谱网
见见船员

它看起来像

正在导致您的问题，请尝试更改

高度：680px
查看问题是否仍然存在

正在导致您的问题，请尝试更改
高度：680px
查看问题是否仍然存在更改此设置
<img src="img/Stage-Background.png" style="position: relative; z-index: 1; height: 680px; top:-500px"/>



到


当您执行position:relative并移动它时，它会保持文档的其余部分与您没有移动它时一样，因此它必须保持其下方的空间。如果你做一个负边距顶部，它会把图像移动的所有东西都拉下来，然后再向上移动。
改变这个
<img src="img/Stage-Background.png" style="position: relative; z-index: 1; height: 680px; top:-500px"/>



到


当您执行position:relative并移动它时，它会保持文档的其余部分与您没有移动它时一样，因此它必须保持其下方的空间。如果你做一个负边距顶部，它会把图像移动的所有东西都拉下来，然后再向上移动。
对我来说效果很好，没有额外的空白。你能把你的代码放进去吗？对我来说很好，没有多余的空格。你能把你的代码放进去吗？改变高度可以去掉空间，但也会缩小图像。有没有其他方法可以改变它？改变高度可以消除空间，但也会缩小图像。有没有其他方法可以改变它？对答案进行了补充解释。另外，如果你去掉了位置：相对的，为什么z-指数仍然适用？在回答中添加了解释。另外，如果去掉了位置：相对，为什么z-index仍然适用？