作者|李娜溫馨提示：細讀本文需要2分鐘，速讀僅需1分鐘韩脑。
*本文為「Java聯(lián)盟」原創(chuàng)內(nèi)容，轉(zhuǎn)載無需授權(quán)粹污，請保留署名來源段多。
hello，小伙伴們大家晚上好呀壮吩！今天李娜又來分享知識了衩匣！有沒有很想我呀！
前面幾章給大家粥航，簡單的介紹了一下網(wǎng)頁中的幾種常見的標簽琅捏。不知道小伙伴們還有印象嗎？有的話可以在評論留言打卡哦递雀。
那么現(xiàn)在李娜就來給大家介紹一下我們的盒子模型吧柄延！
1.什么是盒子？
我們所有的HTML標簽，當(dāng)他們在頁面中顯示的時候具有：外邊距（margin）搜吧、邊框（border）市俊、內(nèi)邊距（padding）、內(nèi)容（content）四個屬性滤奈。
結(jié)構(gòu)如下圖：
這么樣看起來是不是很像一個盒子摆昧，所以稱之為盒子模型。所以當(dāng)我們在設(shè)計一個頁面的時候蜒程，就可以把我們所使用的標簽看成是一個個的小盒子在一個大一點的容器 body 里面經(jīng)行排列绅你。
就好像我們小時候玩的積木是一個道理，（如果你說你沒有玩過昭躺，小編只想說“呵呵”）所以忌锯，我們在學(xué)習(xí)一個新的事物的時候，可以嘗試讓他和我們熟悉的事物進行聯(lián)系领炫，讓他可以和我們原有的記憶連成線偶垮，織成網(wǎng)。便于我們回憶帝洪。
2.盒子模型之盒子的樣式css
那么既然是盒子似舵，就會用自己的款式。我們說的樣式就是給這個盒子規(guī)定他的規(guī)格葱峡。
現(xiàn)在假設(shè)我們要設(shè)計一個
標簽的樣式啄枕，那么我們有兩種寫法:
寫法一：
內(nèi)容
我們把這中寫法成為行內(nèi)樣式。就是一個個的為我們的盒子設(shè)計樣式族沃。
那么這樣子寫频祝。有個弊端就是一旦我們的頁面有很多的標簽，也就是盒子時脆淹。會做很多重復(fù)的工作常空，影響我們的效率。而且當(dāng)我們調(diào)試程序的時候盖溺，也是很困難的漓糙。
就像下面的淘寶頁面。
這個頁面擁有很多的標簽烘嘱，按照上面的寫法昆禽，在制作的時候就會很困難。不過別怕蝇庭，我們還有第二種方法：
寫法二：
把原本寫在標簽內(nèi)的行內(nèi)樣式提取出來寫在一起醉鳖，我們稱之為內(nèi)部樣式。如下圖
div{color：red哮内；font-size：10px盗棵；} 我們稱之為內(nèi)部樣式。
其中：
這樣不僅頁面看起來整潔，便于我們修改纹因，而且同樣樣式的標簽喷屋，我們只設(shè)置一次就可以了！
像這行代碼瞭恰，就把我們頁面內(nèi)的所有div標簽的顏色設(shè)置為紅色屯曹，字體大小設(shè)置為10像素了。這么看來是不是輕松了好多惊畏！
這就是css（Cascading Style Sheets）就是我們所說的層疊樣式表了恶耽。
今天就給大家介紹這么多，主要想讓大家有個盒子的概念陕截，以及簡單的了解一下css驳棱。小編會在后續(xù)的文章中為大家詳細介紹有關(guān)網(wǎng)頁設(shè)計的知識點的批什。小伙伴們有想了解的农曲，歡迎留言哦！么么噠Ｗふ乳规！
當(dāng)然有什么問題或者需要李娜我給大家分享講解的地方，可以在留言區(qū)留言告訴我合呐，整理后會在公眾號里面分享講解哦暮的！
