HTML的學習標準

? ? ? 很多網(wǎng)頁通篇都是<div>，這類網(wǎng)頁語義化很差。學習HTML要做到除了會使用標簽、屬性，還要知道什么時候用什么樣的標簽，并盡可能的寫出語義化的頁面。

? ? ? 最開始的時候肯定做不到這些，很多標簽一般都是用過之后才能夠真正有印象。所以開始上手的時候，可以先找一個網(wǎng)站上已有的簡單頁面，然后自己用盡可能多的并且合適的標簽把它重新寫出來。

? ? ? 寫語義化頁面的好處：越原生的標簽加載速度越快，減少css的使用可加快網(wǎng)頁加載速度。

塊級元素與內(nèi)聯(lián)元素

塊級元素

特征：根據(jù)文檔內(nèi)容平鋪屏幕，創(chuàng)建的塊級元素從新行開始，相鄰塊級元素會在不同行顯示。塊級元素的width=屏幕寬，height＝內(nèi)容自適應。

舉例：<div>,<p>,<h1>標簽

區(qū)別：<p>比<div>多"margin＝16px 0px;"的默認樣式

相似：<p>和<h1>很相似，<h1>非常像是字體加粗，上下邊距增寬后的<p>標簽；但<p>通常用于大段文字，而<h1>用于標題。

小貼士：如何查看標簽的默認樣式？

? ? ? ?打開chrom瀏覽器，command+option+i快捷鍵調(diào)用調(diào)試器，調(diào)試器中的style樣式和盒模型可配合查看標簽默認樣式。

內(nèi)聯(lián)元素

特征：內(nèi)容撐開元素，創(chuàng)建的內(nèi)聯(lián)元素會在同一行按從左至右的順序展開，不單獨占一行。內(nèi)聯(lián)元素的width=內(nèi)容自適應，height＝內(nèi)容自適應。

舉例：<span>標簽

小貼士：塊級元素和內(nèi)聯(lián)元素在加入css樣式后可改變這種差異。當塊級元素加入display:inline屬性后，若干個塊級元素可在同一行顯示；同樣的，當內(nèi)聯(lián)元素加入display:block屬性后，每次新創(chuàng)建的內(nèi)聯(lián)元素也可實現(xiàn)從新行開始的特征。

雙標簽與單標簽

雙標簽

特征：含開始標簽和結束標簽，標簽內(nèi)部可嵌套內(nèi)容

舉例：<div></div>;<span></span>

說明：h5的大部分標簽都是雙標簽

單標簽

特征：在開始標簽內(nèi)直接結束，不再有單獨的結束標簽，標簽內(nèi)無嵌套內(nèi)容

舉例：<img/><br/>

心得

? ? ? 雖然第一節(jié)課由于網(wǎng)絡或者硬件設備的不給力上得有點斷斷續(xù)續(xù)，但也學到了很多東西～課下再重新總結一下筆記感覺有了更系統(tǒng)的收獲～第一次寫技術博客，希望自己再接再厲能夠堅持到底～！