整合營銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
寫法
# 一級(jí)標(biāo)題
## 二級(jí)標(biāo)題
### 三級(jí)標(biāo)題
#### 四級(jí)標(biāo)題
##### 五級(jí)標(biāo)題
###### 六級(jí)標(biāo)題
效果如下：
如上所示，想要獲得幾級(jí)標(biāo)題的樣式，只需要在前面添加幾個(gè)#號(hào)就可以。需要注意的是，最后一個(gè)#和要顯示的標(biāo)題文字之間必須空開至少一個(gè)空格。
由于中文輸入習(xí)慣，我們習(xí)慣在每個(gè)段落的開頭縮進(jìn)兩個(gè)字符，這與我們的閱讀習(xí)慣相符合。縮進(jìn)兩個(gè)字符其實(shí)就是使用空格鍵作為兩個(gè)占位符，但是在markdown中的空格鍵會(huì)被累加消除（但是現(xiàn)在大部分網(wǎng)上的markdown編輯器或主流編輯器均有選項(xiàng)），因此我們需要使用HTML提供的空格實(shí)體實(shí)現(xiàn)段落的縮進(jìn)。
全角空格(Em Space)它占據(jù)的寬度正好是1個(gè)中文字的寬度，并且可以累加，不會(huì)受到字體影響(其實(shí)有很多HTML的空格實(shí)體，看個(gè)人愛好而定)。因此，如果需要在每個(gè)段落開頭實(shí)現(xiàn)縮進(jìn)兩個(gè)字符的效果，可以在段落文字前加上下面的代碼：
??
段落的生成要和文字的換行進(jìn)行區(qū)分，如果你在上個(gè)段落結(jié)束后，只按了一次Enter鍵，那么會(huì)得到如下效果：
所以一次Enter鍵只能得到換行的效果。如果你在上個(gè)段落結(jié)束后選擇按下2次Enter鍵，那么就會(huì)得到如下效果：
分割線常用的符號(hào)有：減號(hào)-，星號(hào)*，下劃線_
??只要上面任意一種符號(hào)連續(xù)累加到三個(gè)或者三個(gè)以上就能形成分割線。效果如下：
對(duì)于標(biāo)題，建議使用 # 號(hào)，幾級(jí)標(biāo)題就是幾個(gè) #；
對(duì)于段落，要按2次Enter區(qū)分，縮進(jìn)用&emap;代表一個(gè)空格；
對(duì)于分割線，建議使用三個(gè)或以上的 * 號(hào)或者-號(hào)，以免與標(biāo)題混淆。
原圖樣式）
今天我們講一下幾個(gè)文本標(biāo)簽<code>text-indent</code>,<code>letter-spacing</code>和<code>line-height</code>,并附加講一下<code>first-line</code>和<code>first-letter</code>的使用方法。
先上源碼：
<!DOCTYPE html>
<html>
<head>
<title>css文本標(biāo)簽介紹</title>
<style>
.wenben{
width:300px;
height: 150px;
background-color: #f0f0f0;
padding: 20px;
border: 1px solid #ccc;
margin:0 auto;
}
</style>
</head>
<body>
<div class="wenben">
今天我們來測(cè)試一下自己間距的設(shè)置方法，主要標(biāo)簽有<code>text-indent</code>、<code>letter-spacing</code>和<code>line-height</code>,附加講一下<code>first-line</code>和<code>first-letter</code>的樣式。
</div>
</body>
</html>
第一個(gè)標(biāo)簽：text-indent（設(shè)置抬頭距離css縮進(jìn)）
css樣式：
<style>
.wenben{
width:300px;
height: 150px;
background-color: #f0f0f0;
padding: 20px;
border: 1px solid #ccc;
margin:0 auto;
text-indent: 23px;
}
</style>
第二個(gè)標(biāo)簽：letter-spacing(設(shè)置字與字之間的間距)
css樣式：
<style>
.wenben{
width:300px;
height: 150px;
background-color: #f0f0f0;
padding: 20px;
border: 1px solid #ccc;
margin:0 auto;
text-indent: 23px;
letter-spacing: 3px;
}
</style>
第三個(gè)標(biāo)簽： line-height(設(shè)置行高，就是每一行的高度)
css樣式：
<style>
.wenben{
width:300px;
height: 150px;
background-color: #f0f0f0;
padding: 20px;
border: 1px solid #ccc;
margin:0 auto;
text-indent: 23px;
letter-spacing: 3px;
line-height: 30px;
}
</style>
第四個(gè)標(biāo)簽，其實(shí)叫做選擇器: ::first-line(設(shè)置第一行的樣式)
<style>
.wenben{
width:300px;
height: 150px;
background-color: #f0f0f0;
padding: 20px;
border: 1px solid #ccc;
margin:0 auto;
text-indent: 23px;
letter-spacing: 3px;
line-height: 30px;
}
.wenben::first-line{
color:blue;
font-weight: bold/*字體加粗*/;
}
</style>
第五個(gè)選擇器: ::first-letter(設(shè)置第一行的第一個(gè)字的樣式)
<style>
.wenben{
width:300px;
height: 150px;
background-color: #f0f0f0;
padding: 20px;
border: 1px solid #ccc;
margin:0 auto;
text-indent: 23px;
letter-spacing: 3px;
line-height: 30px;
}
.wenben::first-line{
color:blue;
font-weight: bold/*字體加粗*/;
}
.wenben::first-letter{
font-size: 24px;
color: white;
font-weight: normal;
border: 1px solid red/*設(shè)置文字邊框*/;
background-color:blue/*設(shè)置文字背景*/;
padding: 2px;
}
</style>
你學(xué)會(huì)了嗎？有問題可以私聊我哦！
言
*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
