段落首行縮進利用div+css

 
 
段落前面空兩個字的距離,不要再使用空格了,用CSS實現段落首縮進兩個字符。應該使用首行縮進text-indent。text-indent可以使得容器內首行縮進一定單位。比如中文段落一般每段前空兩個漢字。
 
在這裏我們需要了解一種長度單位em。em是相對長度單位。相對於當前對象內文本的字體尺寸。我們中文段落一般每段前空兩個漢字。實際上,就是首行縮進了2em。
 
<style type="text/css">
<!-- 
p{
text-indent: 2em; /*em是相對單位,2em即現在一個字大小的兩倍*/
}
-->
</style>
<p>段落前面空兩個字的距離,不要再使用空格了。應該使用首行縮進text-indent。長度單位em。相對於當前對象內文本的字體尺寸。我們首行縮進了2em。2em即現在一個字大小的兩倍。</p>
 
-----------------------------------------------------------------------------------------------------------------
 
用CSS實現段落首縮進兩個字符,實現首行縮進的通用方法是加四個小角空格。
 
其實呢,用CSS樣式來定義更爲高效。
 
比如在style裏定義如下縮進樣式:.suojin{text-indent:2em}
 
在需要縮進的地方使用class="suojin"即可,比如用一個div定義一整塊段落首先縮進,
 
凡在div區域裏,瀏覽器一碰上p語句(即一個新段的開始),就會執行.suojin所定義的縮進。
 
也可以在正文中使用嵌入式CSS樣式來定義,下面舉個實例(使用時請將尖括號改爲小角尖括號):
 
<div style="text-indent:2em">
<p>段落一</p>
<p>段落二</p>
<p>段落三<p>
</div>
 
兩種方法各有長處短處,可根據需要決定使用哪一種方法。
 
注:div標籤不要忘記起始符。text-indent只對p或div標籤有效,對br標籤不生效,原因是br標籤是換行標籤不是分段標籤。
 
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章