【发布时间】：2016-08-20 00:10:05
【问题描述】：
<html>
<style>
body { background-color:#F1EEF2; }
header {
width:800px;
margin-left:auto;
margin-right:auto;
}
layout {
min-width: 100%;
min-height: 100%;
}
nav.header {
width:800px;
height:40px;
background-color:#000000;
color:#fef8f0;
}
nav.footer {
width:800px;
height:30px;
color:#fef8f0;
}
footer {
width:800px;
height:80px;
background:url(images/footer_beans.png) no-repeat #000000;
margin-left:auto;
margin-right:auto;
}
span {
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
color:#c29a5f;
}
p.s1 {
font-family: sans-serif;
font-size:15px;
color:#ffffff;
margin:0px;
padding:10px 24px 0;
}
p.s2 {
font-family: sans-serif;
font-size:15px;
color:#000000;
margin:0px;
padding:12px 10px 15px 12px;
}
ul.header {
width:500px;
margin:0;
padding:0;
padding-top:13px;
float:right;
list-style-type:none;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
}
ul.footer {
width:500px;
float:right;
list-style-type:none;
margin: 0;
padding:0;
padding-top:47px;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
}
li {
float:left;
font-size:11px;
font-weight:bold;
margin:0;
}
a {
padding:8px;
color:#fef8f0;
text-decoration:none;
}
section {
width:800px;
margin:0 auto;
}
article {
width:800px;
height:600px;
}
#left, #right {
background: #000000;
position: fixed;
}
#left, #right {
top: 0; bottom: 0;
width: 10px;
}
#left { left: 265; }
#right { right: 265; }
#hm_topleft {width:434px; height:300px; float:left;}
#hm_topright {width:366px; height:300px; float:left; background:#570401; margin=0; overflow=hidden;}
#hm_content {width:800px; height:300px; margin:auto; float:left; background-color:#000000;}
#hm_contentbox {width:760px; height:130px; margin:25px; background:#F1EEF2; border:3px solid #000000;}
</style>
<div id="layout">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta charset=iso-8859-1>
<title>MAJID JORDAN - Home</title>
</head>
<body>
<header>
<nav class="header";>
<ul class="header">
<li><a href="#">Home</a>|</li>
<li><a href="#">Members</a>|</li>
<li><a href="#">Albums</a>|</li>
<li><a href="#">Gigs & Tours</a>|</li>
<li><a href="#">Gallery</a></li>
</ul>
</nav>
</header>
<section style="width:800px; margin:0 auto;">
<article style=" width:800px; height:600px; ">
<img src="C:\Users\jorda_000.JORDAN-PC\Pictures\Website\logo.jpg" width="200" height="170" alt="MAJID JORDAN"/>
<div
style="
padding: 10px;
top: 10;
right: 480;
position: absolute;
z-index: 1;
visibility: show;
font-size:35px;">
<h1><center><font face="verdana"><strong>MAJID JORDAN</font></center</strong><h1>
</div>
<div id="hm_contentbox">
<p class="s2">Majid Jordan is a Canadian R&B duo, composed of singer Majid Al Maskati and producer Jordan Ullman. They are signed to OVO Sound, the record label co-founded by rapper Drake, producer Noah "40" Shebib and Oliver El-Khatib.
Jordan, originally from Toronto, and Majid, arriving in Toronto by way of Bahrain, met as students at the University of Toronto in 2011. Working between Ullman's dorm room and his parents' basement, they launched their first joint EP titled Afterhours on SoundCloud under their previous name Good People.</p>
</div>
<div
style="
position: absolute;
top: 390px;
right: 285px;
border: 3px solid black;">
<img src="C:\Users\jorda_000.JORDAN-PC\Pictures\Website\home.jpg" width="400" height="300" alt="MAJID JORDAN"/>
</div>
<button style="margin:auto;border-radius:10px;border:1px solid black;color:solid black;height:60px;width:300px;font-size:24px;position:absolute;top:400;left:300;"><strong>
Members
</button></strong>
<button style="margin:auto;border-radius:10px;border:1px solid black;color:solid black;height:60px;width:300px;font-size:24px;position:absolute;top:480;left:300;"><strong>
Albums & Songs
</button></strong>
<button style="margin:auto;border-radius:10px;border:1px solid black;color:solid black;height:60px;width:300px;font-size:24px;position:absolute;top:560;left:300;"><strong>
Gigs & Tours
</button></strong>
<button style="border-radius:10px;border:1px solid black;color:solid black;height:60px;width:300px;font-size:24px;position:absolute;top:640;left:300;"><strong>
Gallery
</button></strong>
<footer style="position:absolute;top:710;>
<nav class="footer">
<ul class="footer">
<li class="hf1"><a>Members </a>|</li>
<li class="hf1"><a>Albums & Songs </a>|</li>
<li class="hf1"><a>Gigs & Tours </a>|</li>
<li class="hf1"><a>Gallery</a></li>
</ul>
</nav>
</footer>
<div id="left"></div>
<div id="right"></div>
<div id="top"></div>
<div id="bottom"></div>
</div>
</body>
</html>在 html 方面，我是一个极端的初学者，我正在自己选择的乐队上创建一个小型网站，它在我用来创建网站的计算机上看起来非常好，但在另一台计算机上分辨率不同，整体布局混乱，物体重叠等。
如我所说，任何帮助将不胜感激，我对这种语言非常陌生，如果您需要更多信息，我会尽力为您提供帮助。
【问题讨论】：
-
给你代码或摆弄它.. 获得引导的基本知识，以便你的页面在所有分辨率下看起来都一样
-
您必须让网站具有响应性......这样它才能在手机、ipad、笔记本电脑等所有设备上运行......请参考getbootstrap.com
-
这个问题要么过于宽泛，要么基于观点，要么需要讨论，因此与 Stack Overflow 无关。如果您有具体的、可回答的编程问题，请提供完整的详细信息。