一些最簡(jiǎn)單的html標(biāo)簽
（瀏覽器解析代碼換行問(wèn)題）
??? 今天重新從最基礎(chǔ)的前端代碼學(xué)了一遍悬槽，感受頗深，很多細(xì)節(jié)的東西都沒(méi)有注意到瞬浓。哪怕是最簡(jiǎn)單的p標(biāo)簽也有了新的認(rèn)識(shí)初婆，對(duì)于以后的css布局有了很大的幫助。
??? 標(biāo)題標(biāo)簽（h1~h6）：作為標(biāo)題標(biāo)簽，字體自動(dòng)加粗磅叛，占據(jù)網(wǎng)頁(yè)的整行并且自動(dòng)換行屑咳，上下具有邊框，也就是字體的高度為10px弊琴，那么它在網(wǎng)頁(yè)中就可能是10+2+2px乔宿。
? div標(biāo)簽：作為最重要的分塊標(biāo)簽，div默認(rèn)情況下也會(huì)占據(jù)一整行访雪，自動(dòng)換行详瑞，上下無(wú)邊框，兩個(gè)div上下緊緊相連臣缀。
? 段落標(biāo)簽（p）：作為一個(gè)段落坝橡，自然而然會(huì)自動(dòng)換行，同樣占據(jù)一整行精置，上下具有邊框计寇。
? 文字標(biāo)簽（span）:作為文字標(biāo)簽可以插到p標(biāo)簽中，作為段落的一部分脂倦。不具備自動(dòng)換行的能力番宁，上下無(wú)邊框。
涉及到代碼換行問(wèn)題赖阻。
? 下面我們來(lái)實(shí)際看看（為了更好地看清我加了背景顏色）
<span style="background-color:skyblue">123</span>
<span style="background-color:pink">456</span>
?自動(dòng)解析了代碼中的換行 將代碼中的回車字符瀏覽器翻譯成了空格字符
<span style="background-color:skyblue">123</span><span style="background-color:pink">456</span>
?? 兩個(gè)span標(biāo)簽之間無(wú)換行蝶押，自動(dòng)就連接在了一起。
?? 其中這個(gè)第一種情況不是我們前端UI設(shè)計(jì)師想要的火欧，由于代碼的換行導(dǎo)致了解析html的空格字符棋电，可能會(huì)影響我們的布局細(xì)節(jié)。我查閱了相關(guān)資料其中input標(biāo)簽也有同樣的問(wèn)題苇侵，下面我們分享一些解決方案赶盔。
??? 1.寫(xiě)代碼的時(shí)候不要換行，input榆浓，span等在一行輸寫(xiě)于未，那么將解決該問(wèn)題。但是代碼就變得不再那么容易好看陡鹃。
??? 2.利用css烘浦，設(shè)置父級(jí)塊的格式，即font-size=0杉适。
?? 3.設(shè)置外邊框?yàn)樨?fù)值谎倔。即margin-right或者margin-left=-3px柳击。（可能瀏覽器不同猿推，像素距離也不同）。
?外加一些常用不常見(jiàn)標(biāo)簽
sup 上標(biāo)簽? sub下標(biāo)簽
dbo的（dir屬性）rtl 從右往左輸出顯示，ltr從左往右正常顯示蹬叭。
