如何在網(wǎng)頁(yè)制作時(shí)使用CSS定義文本樣式(四)

  • 2019-08-01 16:35:25
  • 閱讀次數(shù):
  • 作者:盈嵐科技小編
  • 來(lái)源:http://m.supportcoffeeroasters.com

定義行距

行間距,是在設(shè)計(jì)網(wǎng)頁(yè)中段落文本行之間的距離。CSS使用line-height屬性定義行高,在網(wǎng)站建設(shè)時(shí),該屬性的用法如下。

line-height : normal | length

其中,normal表示默認(rèn)值,一般為1.2em;length表示百分比數(shù)字,或者由浮點(diǎn)數(shù)字和單位標(biāo)識(shí)符組成的長(zhǎng)度值,允許為負(fù)值。

【示例】新建一個(gè)網(wǎng)頁(yè),保存為test.html,在<head>標(biāo)簽內(nèi)添加<style type="text/css">標(biāo)簽,定義一個(gè)內(nèi)部樣式表,然后輸入下面樣式,定義兩個(gè)行高類(lèi)樣式。

.p1 {    

font-size:12pt;    

line-height:12pt;   /*行間距為絕對(duì)數(shù)值*/}

.p2 {    

font-size:10pt;   

line-height:2em;    /*行間距為相對(duì)數(shù)值*/}

然后在<body>標(biāo)簽中輸入兩行段落文本,并應(yīng)用上面兩個(gè)類(lèi)樣式。

<h1>社戲</h1><h2>魯迅 

</h2>

<p  class="p1">我在倒數(shù)上去的二十年中,只看過(guò)兩回中國(guó)戲,前十年是絕不看,因?yàn)闆](méi)有看戲的意思和機(jī)會(huì),那兩回全在后十年,然而都沒(méi)有看出什么來(lái)就走了。</p>

<p  class="p2">第一回是民國(guó)元年我初到北京的時(shí)候,當(dāng)時(shí)一個(gè)朋友對(duì)我說(shuō),北京戲最好,你不去見(jiàn)見(jiàn)世面么?我想,看戲是有味的,而況在北京呢。于是都興致勃勃的跑到什么園,戲文已經(jīng)開(kāi)場(chǎng)了,在外面也早聽(tīng)到冬冬地響。我們挨進(jìn)門(mén),幾個(gè)紅的綠的在我的眼前一閃爍,便又看見(jiàn)戲臺(tái)下滿(mǎn)是許多頭,再定神四面看,卻見(jiàn)中間也還有幾個(gè)空座,擠過(guò)去要坐時(shí),又有人對(duì)我發(fā)議論,我因?yàn)槎湟呀?jīng)喤的響著了,用了心,才聽(tīng)到他是說(shuō)“有人,不行!”</p>

定義縮進(jìn)

CSS在網(wǎng)頁(yè)制作時(shí)使用text-indent屬性定義首行縮進(jìn),該屬性的用法如下:

text-indent : length

length表示百分比數(shù)字,或者由浮點(diǎn)數(shù)字和單位標(biāo)識(shí)符組成的長(zhǎng)度值,允許為負(fù)值。建議在設(shè)置縮進(jìn)單位時(shí),以em為設(shè)置單位,它表示一個(gè)字距,這樣比較精確確定首行縮進(jìn)效果。

【示例】新建一個(gè)網(wǎng)頁(yè),保存為test.html,在<head>標(biāo)簽內(nèi)添加<style type="text/css">標(biāo)簽,定義一個(gè)內(nèi)部樣式表,然后輸入下面樣式,定義段落文本首行縮進(jìn)2個(gè)字符。

p {        

text-indent:2em;    /*首行縮進(jìn)2個(gè)字距*/}

然后在<body>標(biāo)簽中輸入如下標(biāo)題和段落文本。

<h1>社戲</h1>

<h2>魯迅 </h2>

<p>我在倒數(shù)上去的二十年中,只看過(guò)兩回中國(guó)戲,前十年是絕不看,因?yàn)闆](méi)有看戲的意思和機(jī)會(huì),那兩回全在后十年,然而都沒(méi)有看出什么來(lái)就走了。</p>

<p>第一回是民國(guó)元年我初到北京的時(shí)候,當(dāng)時(shí)一個(gè)朋友對(duì)我說(shuō),北京戲最好,你不去見(jiàn)見(jiàn)世面么?我想,看戲是有味的,而況在北京呢。于是都興致勃勃地跑到什么園,戲文已經(jīng)開(kāi)場(chǎng)了,在外面也早聽(tīng)到冬冬地響。我們挨進(jìn)門(mén),幾個(gè)紅的綠的在我的眼前一閃爍,便又看見(jiàn)戲臺(tái)下滿(mǎn)是許多頭,再定神四面看,卻見(jiàn)中間也還有幾個(gè)空座,擠過(guò)去要坐時(shí),又有人對(duì)我發(fā)議論,我因?yàn)槎湟呀?jīng)喤的響著了,用了心,才聽(tīng)到他是說(shuō)“有人,不行!”</p>


當(dāng)前文章標(biāo)題:如何在網(wǎng)頁(yè)制作時(shí)使用CSS定義文本樣式(四)

當(dāng)前URL:http://m.supportcoffeeroasters.com/news/wzzz/3065.html

上一篇:如何在網(wǎng)頁(yè)制作時(shí)使用CSS定義文本樣式(三)

下一篇:設(shè)計(jì)網(wǎng)頁(yè)正文樣式

網(wǎng)站建設(shè)、網(wǎng)絡(luò)營(yíng)銷(xiāo)咨詢(xún)專(zhuān)線:181-8386-5875(點(diǎn)擊可一鍵撥號(hào))