整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
tml字間距怎么設置？
大家好，這節課主要來講解一下在html中如何設置字間距。通常使用CSS的letter-spacing屬性，這個屬性可以直接在html元素的style屬性中設置，或者在一個獨立的CSS文件中。下面是兩種常見的設置方法。
·首先來看第一種方法：內欄樣式。在p標簽的后面加上style，等于下入設置為5個PX，保存運行。可以看到這里設置成了字間距為5個PX。
·當然還可以通過層疊樣式表，也就是CSS樣式表來實現在一個獨立的CSS文件或html文檔的head部分的style標簽中設置字間距。例如現在新建了一個style點CSS這樣的文件，可以設置它的letter-spacing，點10個PX，然后保存。
·并且在html文件中引入CSS樣式表，保存運行。稍等一下，要把引號去掉運行。可以看到它有10個PX像素，在letter-spacing屬性接受不同的單位，例如像素PX點PT EM等單位，可以根據需要選擇合適的單位來設置字間距。
以上就是html如何設置字間距的方式和方法。
原圖樣式）
今天我們講一下幾個文本標簽<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文本標簽介紹</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">
今天我們來測試一下自己間距的設置方法，主要標簽有<code>text-indent</code>、<code>letter-spacing</code>和<code>line-height</code>,附加講一下<code>first-line</code>和<code>first-letter</code>的樣式。
</div>
</body>
</html>
第一個標簽：text-indent（設置抬頭距離css縮進）
css樣式：
<style>
.wenben{
width:300px;
height: 150px;
background-color: #f0f0f0;
padding: 20px;
border: 1px solid #ccc;
margin:0 auto;
text-indent: 23px;
}
</style>
第二個標簽：letter-spacing(設置字與字之間的間距)
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>
第三個標簽： line-height(設置行高，就是每一行的高度)
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>
第四個標簽，其實叫做選擇器: ::first-line(設置第一行的樣式)
<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>
第五個選擇器: ::first-letter(設置第一行的第一個字的樣式)
<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/*設置文字邊框*/;
background-color:blue/*設置文字背景*/;
padding: 2px;
}
</style>
你學會了嗎？有問題可以私聊我哦！
說完HTML語言CSS字體的縮進text-indent,接下來我們講下字體的行間距屬性 line-height. 該屬性用來設置行間的距離，也就是我們經常說的行高。可以控制文字行與行之間的距離。
來一起看下line-height的語法:
p {
line-height:20px;
}
怎么理解行間距呢？看下面這個圖就可以理解了
對于一行文字來說，文字上面和上一行文字的下面，文本高度，文字的下面和下一行文字的上面，三者加起來就是整個行間距。
來看下具體的效果:
可以看出，段落間的行間距是16px,如果是一行文字的話，可以看的更清楚
<!DOCTYPE html>
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
