這是一個面向零基礎的前端教程,很簡單,用零散時間就可以學習。?
推薦早上讀一下,晚上復習一下,如果可以奢侈一點,白天稍微練習一下下,總共花費 5~15 分鐘。就醬!
已經好幾次提到塊(block)元素了,但都沒有仔細講解它的特征,現在開始來稍微認識一下。
nav 這個元素就是一個塊元素。我們加上背景以后,可以觀察到它的寬度是從左邊到右邊占滿的。塊元素的寬度默認是 100%。
如果你寫一個 div,然后給他設置背景是看不見的,因為它的高度是0沒有面積,所以并不會顯示出來。如果你給他一個高度,或者在里面放上內容,將它的高度撐開就能夠看到了。
但如果不給高度只給寬度,因為高度為 0,面積依然為 0,所以還是看不見。
給了高度,給了寬度,當他占不滿整個寬度的時候,就會靠左側顯示。那如果有連續的幾個塊元素,即便寬度足夠讓他們并排(水平排列),他們依然會每一個占據一行縱向排列。
上面這些內容都可以自己動手嘗試來體會一下。下面的內容先了解一下理論,我們后面再慢慢的深入。
我們稱他為盒子,但實際上是二維的,所以他有上下左右 4 個邊框。默認情況下邊框是沒有寬度的,也不會顯示出來,當然我們可以設置邊框的寬度和樣式等。
盒子里面當然可以裝內容,盒子里面也可以套盒子。在盒子邊框的內側,我們還可以“墊”東西,這樣盒子里裝的內容和盒子的邊框之間就隔開了距離,這叫做內補,就是在盒子的內壁補充了一部分空間。
反之還有外補,就是在盒子的外面補充了一部分空間,可以使相鄰的盒子之間隔開距離。
>>>===?小老鼠賣著萌走過去的分割線 ===<<<
學習的秘訣就在于堅持下去,可以通過給文章點贊來打卡學習。也讓小老鼠了解到有人在看,然后更努力的更新。堅持,一起哦~?
有疑問,有想法,有理解……都可以寫在評論里。聽懂了不等于會使用,會使用不等于能講出來。嘗試講出自己的理解,是很好的學習方法呢~(小老鼠就在這樣學習著,可愛!
可以來微信群一起討論嗷~~【前端小課堂】微信群
這么可愛的小老鼠……Rua!這么簡單的小教程,就學一下唄~~
【決心】學習的,可以找小老鼠,用小“鞭子”督促你~(收費哦,還貴呢~~