css中文字能夠撐開高度嗎

antzone發表於2017-03-21
CSS

本章節介紹一個可能比較誤導人的概念。

那就是當一個div沒有設定高度的時候，可能很多人認為它的高度是由內部的文字撐開的，真的是這樣嗎，下面就通過程式碼例項進行一下驗證，程式碼例項如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<style type="text/css">
div{
  width:300px;
  border:1px solid red;
  line-height:0px;
}
</style>
</head>
<body>
<div>螞蟻部落</div>
</body>
</html>

大家看到演示結果了沒有，高度並沒有被撐開，這裡涉及到line-height的相關知識。

關於line-height可以參閱line-height屬性深入介紹一章節。

相關文章