問題描述

我在學(xué)習(xí)慕課網(wǎng)的網(wǎng)頁布局基礎(chǔ)時(shí)碰到這樣的問題，相同的html和css代碼，設(shè)置font-family之前是這樣：

在設(shè)置了*{font-family:Arial, Helvetica, sans-serif,'宋體';}這條css之后就變成了這樣：

剛開始學(xué)習(xí) html+css ，很迷惑。

問題解答

這種一般都會(huì)用ul>li這樣的結(jié)構(gòu)去寫，然后再把li的display設(shè)置為inline-block，就橫過來了。但是li和li之間一般都是有起碼一個(gè)換行的，比如：

<ul> <li>A</li> <li>B</li></ul>

這種就是帶換行符的，而除非你寫成：

<ul><li>A</li><li>B</li></ul>

否則換行符就會(huì)造成li之間的間隙，也就是你圖1里換行問題的原因。（張鑫旭大神的博客里說過這個(gè)東西，建議你去看下~）而如果設(shè)置了全局字體的話，一個(gè)可能是會(huì)讓換行符“更瘦”，所以會(huì)把第二行拉上來。

猜測： 將你html中ul,li這樣的標(biāo)簽之間的空格和換行都去掉試試。