想問一下,div是不是默認塊狀元素,是不是獨占一行的?為何下面的代碼做出來的div不會獨占一行
<!DOCTYPE html>
<html>
<head>
<style>
#header {
? ? background-color:black;
? ? color:white;
? ? text-align:center;
? ? padding:5px;
}
#nav {
? ? line-height:30px;
? ? background-color:#eeeeee;
? ? height:300px;
? ? width:100px;
? ? float:left;
? ? padding:5px; ? ? ?
}
#section {
? ? width:350px;
? ? float:left;
? ? padding:10px; ?
}
#footer {
? ? background-color:black;
? ? color:white;
? ? clear:both;
? ? text-align:center;
? ?padding:5px; ?
}
</style>
</head>
<body>
<div id="header">
<h1>City Gallery</h1>
</div>
<div id="nav">
London<br>
Paris<br>
Tokyo<br>
</div>
<div id="section">
<h2>London</h2>
<p>
London is the capital city of England. It is the most populous city in the United Kingdom,
with a metropolitan area of over 13 million inhabitants.
</p>
<p>
Standing on the River Thames, London has been a major settlement for two millennia,
its history going back to its founding by the Romans, who named it Londinium.
</p>
</div>
<div id="footer">
Copyright ? W3Schools.com
</div>
</body>
</html>
2017-02-24
因為 在"nav"和"section"的樣式中 使用了float元素定位,float會使子元素從父級元素中脫離出來,相當于從原來的塊級標簽變成行級標簽,所以他們就可以排列在一行了,而不是單獨占據一行