我期待构建一个网站并使用CSS定位。但是对于每个决议,由于保证金属性,它将边界放置在不同的位置。但是,如何将所有屏幕分辨率均匀分布?所有分辨率的CSS元素定位
<!DOCTYPE html>
<html>
<head>
<title>Demo Page</title>
<style type="text/css">
#homeHeader{
text-align: center;
font-family: Verdana;
}
#homeTabs{
border: 1px solid black;
height: 800px;
width: inherit;
}
#tabOne{
margin:50px 50px 20px 100px;
width: 100px;
height: 60px;
border: 1px solid black;
}
#tabTwo{
margin: 0px 50px 20px 250px;
font-family: Arial;
font-style: italic;
width: 100px;
height: 60px;
border: 1px solid black;
}
#tabThree{
margin: 0px 50px 20px 400px;
font-family: Arial;
font-style: italic;
width: 100px;
height: 60px;
border: 1px solid black;
}
#tabFour{
margin: 0px 50px 20px 550px;
font-family: Arial;
font-style: italic;
width: 100px;
height: 60px;
border: 1px solid black;
}
#tabFive{
margin: 0px 50px 20px 700px;
font-family: Arial;
font-style: italic;
width: 100px;
height: 60px;
border: 1px solid black;
}
#tabSix{
margin: 0px 50px 20px 850px;
font-family: Arial;
font-style: italic;
width: 100px;
height: 60px;
border: 1px solid black;
}
#tabSeven{
margin: 0px 50px 20px 1000px;
font-family: Arial;
font-style: italic;
width: 100px;
height: 60px;
border: 1px solid black;
}s
center{
font-family: verdana;
}
</style>
</head>
<body>
<div id="homeHeader">
<h1 id="headerH1">HOMELESS MONKEYS</h1>
</div>
<div id="homeTabs">
<div id="tabOne">
<center><br>Fashion1</center>
</div>
<div id="tabTwo">
<center><br>Fashion2</center>
</div>
<div id="tabThree">
<center><br>Fashion3</center>
</div>
<div id="tabFour">
<center><br>Fashion4</center>
</div>
<div id="tabFive">
<center><br>Fashion5</center>
</div>
<div id="tabSix">
<center><br>Fashion6</center>
</div>
<div id="tabSeven">
<center><br>Fashion7</center>
</div>
</div>
</body>
</html>
我可以理解,它把不同的不同的分辨率从边境,因为保证金的距离,但如何使其同样为所有的屏幕分辨率间隔多长时间?