當前位置:軟件學堂 > 資訊首頁 > 網絡編程 > DIV+CSS > CSS調整行高line-height屬性

CSS調整行高line-height屬性

2012/11/24 10:07:39作者:佚名來源:網絡

移動端

【實例介紹】

CSS調整行高line-height屬性

在HTML中是無法控制段落中行與行之間的距離的。在CSS中,使用line-height可以控制行的高度,通過它就可以調整行與行之間的距離。

【基本語法】

line-height:行高值

【語法介紹】

可以使用數(shù)值或百分比設置行的高度。

【實例代碼】

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>無標題文檔</title> </head> <style type="text/css"> .CSS {  font-family: "宋體";  font-size: 18px;  text-indent: 2em;  line-height: 250%; } </style> <body class="CSS"> 其實以不挑剔的眼光來看,學校的綠化還是蠻好的。一路的花花草草, 各種各樣甚至叫不出名兒的樹,有的還開著小花,路旁的泥土地里也冒 著青色的芽兒。春夏時節(jié),柳葉繁茂起來,柳絮隨風飛揚,成片的樹葉 也都精神的在陽光下透著青翠欲滴的光影。 </body> </html>

【代碼分析】

在代碼中,加粗部分的line—height:250%標記設置文本的行高為250%,在瀏覽器中預覽效果,如圖所示。

調整行高line—height運行效果

 【素材及源碼下載】

請點擊:CSS調整行高line-height 下載本實例相關素材及源碼

 

標簽: CSS  調整  行高