在網(wǎng)頁(yè)中插入多個(gè)空格是html中經(jīng)常用到的,實(shí)現(xiàn)html空格的方式有很多種,下面給大家一一介紹。
:一個(gè)字符的半角的不斷行的空格,如果需要在網(wǎng)頁(yè)中插入多個(gè)空格,可以將“ ”代碼寫(xiě)多遍(常用方式);
  :一個(gè)字符的半角的空格,也可以將“?”寫(xiě)多遍來(lái)插入多個(gè)空格;
  :兩個(gè)字符的全角的空格,也可以將“?”寫(xiě)多遍來(lái)插入更多的空格;
 :小于一個(gè)字符的空格;說(shuō)明:?jiǎn)卧~后面的分號(hào)記得帶上,是不能省略的,它也是html代碼中的一部分
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8" /> <title>網(wǎng)頁(yè)中怎么插入多個(gè)空格-基礎(chǔ)教程(cainiaoplus.com)</title></head> <body> <p>html空格 空格 基礎(chǔ)教程(cainiaoplus.com)</p> <p>html空格   空格   基礎(chǔ)教程(cainiaoplus.com)</p> <p>html空格   空格   基礎(chǔ)教程(cainiaoplus.com)</p> <p>html空格   空格   基礎(chǔ)教程(cainiaoplus.com)</p> </body> </html>測(cè)試看看 ?/?
運(yùn)行后效果如下:
我們?yōu)槭裁匆褂胔tml空格符號(hào)代碼呢?為什么不直接在鍵盤(pán)上敲幾個(gè)空格呢?當(dāng)你實(shí)際操作的時(shí)候,你會(huì)發(fā)現(xiàn):默認(rèn)情況下,無(wú)論你在html源代碼中敲幾個(gè)空格,在瀏覽器中運(yùn)行都只顯示一個(gè)空格。所以我們就需要使用html空格符號(hào)代碼來(lái)實(shí)現(xiàn)網(wǎng)頁(yè)中多個(gè)空格的效果。
上面為什么會(huì)說(shuō)在默認(rèn)情況下呢?其實(shí)我們還可以使用css中的“white-space”屬性來(lái)實(shí)現(xiàn)多個(gè)空格的效果。就是將“white-space”屬性值設(shè)置為“pre”,設(shè)置之后,瀏覽器就會(huì)保留html源代碼中的空格和換行。這下你在源代碼中敲幾個(gè)空格,瀏覽器中運(yùn)行就會(huì)用幾個(gè)空格。
說(shuō)明:一般在網(wǎng)頁(yè)開(kāi)發(fā)中,都是使用html空格符號(hào)代碼來(lái)實(shí)現(xiàn)多個(gè)空格的效果。
符號(hào) | 表示 |
---|---|
  | 普通的英文半角空格 |
    | 普通的英文半角空格但不換行 |
  | 中文全角空格(一個(gè)中文寬度) |
    | 半角(en)空格 (半個(gè)中文寬度,不受字體影響) |
    | 全角(em)空格 (一個(gè)中文寬度,不受字體影響) |
  | 四分之一全角(em)空格 (四分之一中文寬度) |
  | 普通空格 |
| 相比普通空格,不間斷,按下space鍵產(chǎn)生的空格,不累加 |
em是字體排印學(xué)的計(jì)量單位,相當(dāng)于當(dāng)前指定的點(diǎn)數(shù)。例如,1 em在16px的字體中就是16px。
en是字體排印學(xué)的計(jì)量單位,為em寬度的一半。根據(jù)定義,它等同于字體度的一半(如16px字體中就是8px)。等于是小寫(xiě)字母n的寬度。
擁有不間斷(non-breaking)特性指:
連續(xù)的nbsp會(huì)在同一行內(nèi)顯示。即 假使有無(wú)數(shù)個(gè)連續(xù)的nbsp,瀏覽器也不會(huì)把它們拆成兩行。