這是一個面向零基礎的前端教程，很簡單，用零散時間就可以學習。?

推薦早上讀一下，晚上復習一下，如果可以奢侈一點，白天稍微練習一下下，總共花費 5~15 分鐘。就醬！

已經好幾次提到塊(block)元素了，但都沒有仔細講解它的特征，現在開始來稍微認識一下。

nav 這個元素就是一個塊元素。我們加上背景以后，可以觀察到它的寬度是從左邊到右邊占滿的。塊元素的寬度默認是 100%。

如果你寫一個 div，然后給他設置背景是看不見的，因為它的高度是0沒有面積，所以并不會顯示出來。如果你給他一個高度，或者在里面放上內容，將它的高度撐開就能夠看到了。

但如果不給高度只給寬度，因為高度為 0，面積依然為 0，所以還是看不見。

給了高度，給了寬度，當他占不滿整個寬度的時候，就會靠左側顯示。那如果有連續的幾個塊元素，即便寬度足夠讓他們并排(水平排列)，他們依然會每一個占據一行縱向排列。

上面這些內容都可以自己動手嘗試來體會一下。下面的內容先了解一下理論，我們后面再慢慢的深入。

我們稱他為盒子，但實際上是二維的，所以他有上下左右 4 個邊框。默認情況下邊框是沒有寬度的，也不會顯示出來，當然我們可以設置邊框的寬度和樣式等。

盒子里面當然可以裝內容，盒子里面也可以套盒子。在盒子邊框的內側，我們還可以“墊”東西，這樣盒子里裝的內容和盒子的邊框之間就隔開了距離，這叫做內補，就是在盒子的內壁補充了一部分空間。

反之還有外補，就是在盒子的外面補充了一部分空間，可以使相鄰的盒子之間隔開距離。

>>>===?小老鼠賣著萌走過去的分割線 ===<<<

學習的秘訣就在于堅持下去，可以通過給文章點贊來打卡學習。也讓小老鼠了解到有人在看，然后更努力的更新。堅持，一起哦~?

有疑問，有想法，有理解……都可以寫在評論里。聽懂了不等于會使用，會使用不等于能講出來。嘗試講出自己的理解，是很好的學習方法呢~(小老鼠就在這樣學習著，可愛！

可以來微信群一起討論嗷~~【前端小課堂】微信群

這么可愛的小老鼠……Rua！這么簡單的小教程，就學一下唄~~

【決心】學習的，可以找小老鼠，用小“鞭子”督促你~(收費哦，還貴呢~~

總結

以上是生活随笔為你收集整理的两个相邻盒子的边框怎么只显示一个_【前端小课堂】0044 盒子的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。