居中网页 [英] Centering a web page
问题描述
我正在尝试找到我的网页。还有一个最小的1000px与它放大。目前我的网页,因为它缩放它是中心30%-center-70%。我很困惑为什么这种情况发生。如果任何人可以解释为什么这是发生,这将是巨大的。
I am trying to center my webpage. Also there is a min 1000px with and it scales up. Currently my page as it scales it is off centered 30%-center-70%. I am confused as to why this is happening. If anyone can explain why this is happening that would be great.
>
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Title</title>
<style type="text/css">
#page {
position:relative;
display:block;
width:75%;
margin:auto;
min-width:1000px;
z-index:0;
}
#pageImg {
position:absolute;
width:75%;
margin:auto;
min-width:1000px;
z-index:1;
}
#navBarImg {
position:absolute;
width:75%;
margin:auto;
min-width:1000px;
z-index:2;
}
</style>
</head>
<body>
<div id="page">
<img id="pageImg" src="../Navigation/backgroundImg.png" />
<div id="navBar">
<img id="navBarImg" src="../Navigation/navBarBGImg.png" />
</div>
</div>
</body>
</html>
推荐答案
已发布。这可以推断,因为你做的post代码工作,因为你打算。 工作示例(1000像素宽度将不适合呈现窗口的默认窗口大小,请使用滑块
There is additional code to consider that you haven't posted yet. This can be inferred because the code you did post works as you intend it to. A working example (the 1000px width won't fit in the default window size of the rendered window, use the sliders to expand it and see your code is working).
您使用的CSS:
#page {
position:relative;
display:block;
width:75%;
margin:auto;
min-width:1000px;
z-index:0;
}
#pageImg {
position:absolute;
width:75%;
margin:auto;
min-width:1000px;
z-index:1;
}
#navBarImg {
position:absolute;
width:75%;
margin:auto;
min-width:1000px;
z-index:2;
}
这篇关于居中网页的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!