0
我正在製作一個網頁。我正在嘗試將我的div正確對齊（動畫公司徽標）。對齊和中心divs
我需要他們坐在彼此旁邊，而不是彼此頂部，間距適合頁面。
這可能使事情變得更加清晰：
這裏是我的代碼：
<html>
<head>
<link href="bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" type="text/CSS" href="Style.css" />
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<header id="container">
<h1>
<a href="a">My Interactive Webpage </a>
</h1>
<h1>
<a href="a">Career Page </a>
</h1>
<style>
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: #111;
}
.active {
background-color: #4CAF50;
}
</style>
<ul>
<li><a class="active" href="index.html">Home</a></li>
<li><a href="Information Page.html">Information</a></li>
<li><a href="Game Page.html">Games</a></li>
<li><a href="Career Page.html">Career</a></li>
</ul>
</header>
<div id="container">
<head>
<center>
<p><font face="verdana" color="green">Welcome to my Career Page!
I am passionate about all aspects of computer games development especially programming and games design. Since an early age I have played and experienced a wide range of platforms and games and retain my love for this form of entertainment. One of my favourite games of all time is Oblivion, on the PC and developed by Bethesda, it played brilliantly, was graphically superb and had a perfect soundtrack. I would love to be involved in developing a game of that quality for the current generation of platforms as well as PC. A computer games programme that gives me a strong foundation in computer science is ideal. It gives me the fundamental skills and knowledge for adapting to this rapidly changing and evolving games industry.
Below are some of the companies I would dream of working for. Please click the text to be taken to the respective homepage of each company.
</font></p>
</center>
</div>
<div class="tilt pic">
<style>
#rcorners3 {
border-radius: 25px;
background: url(http://i.imgur.com/AkIPWeF.png);
background-position: left top;
background-repeat: repeat;
padding: 20px;
width: 200px;
height: 150px;
}
</style>
<a href="http://eu.blizzard.com/en-gb/">
<font color="white"><p id="rcorners3">BLIZZARD ENTERTAINMENT</p></font>
</a>
</div>
<div class="tilt pic">
<style>
#rcorners2 {
border-radius: 25px;
background: url(http://i.imgur.com/Mouf1lw.png);
background-position: left top;
background-repeat: repeat;
padding: 20px;
width: 200px;
height: 150px;
}
</style>
<a href="http://www.naughtydog.com/"> <font color="white"><p id="rcorners2">NAUGHTY DOG</p></font>
</a>
</div>
<!DOCTYPE html>
<html>
<head>
<div class="tilt pic">
<style>
#rcorners4 {
border-radius: 25px;
background: url(http://i.imgur.com/pFeIHdd.png);
background-position: left top;
background-repeat: repeat;
padding: 20px;
width: 200px;
height: 150px;
}
</style>
<a href="https://www.ubisoft.com/en-GB/">
<font color="white"><p id="rcorners4">UBISOFT</p></font>
</a>
</div>
</body>
</html>
</body>
</html>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="bootstrap/js/bootstrap.js" type="text/javascript"></script>
</body>
</html>
您的HTML有很多錯誤。首先，一個HTML文檔只應該有一個''元素，其他所有元素都在那裏。如果你確定你的HTML語法是正確的，那麼你的文檔在不同瀏覽器中看起來相同的機率會更大。 –
謝謝。我目前正在通過我的代碼嘗試刪除我的新手錯誤。 –
[如何在另一個div中對齊3個div（左/中/右）？]（http://stackoverflow.com/questions/2603700/how-to-align-3-divs-left-center-right -inside-another-div） – hotzst