歡迎來到DIVCSS5查找CSS資料與學習DIV CSS布局技術!
您的位置:DIVCSS5首頁 > DIV+CSS基礎 >

DIV CSS text-indent段落首行文字縮進CSS段首縮進,可控制縮進距離樣式教程篇

讓每個段落首行開頭文字縮進,如縮進2個文字距離樣式,我將用到text-indent屬性樣式。

一、text-indent縮進語法與結構   -   TOP

.divcss5{text-indent:25px}
這里divcss5對象內段落首行開頭文字縮進了25像素

css text-indent文本縮進樣式屬性單詞,text-indent的值跟數字+單位組成縮進樣式。

二、css段落段首文字縮進案例   -   TOP

通常text-indent縮進屬性將對段落首行開頭文本文字進行縮進顯示。如果使用html br換行標簽,第二個換行開始也不會出現縮進效果。如果使用了html P段落標簽段落換行,將會出現每個p段落換行開頭都將縮進,這里我們給大家通過案例演示給大家,希望通過DIVCSS5案例掌握CSS text-indent縮進樣式。

1、CSS代碼
.divcss5{ text-indent:35px}

2、HTML代碼片段

  1. <div class="divcss5"> 
  2. <p>第一段開始縮進效果<br /> 
  3. 使用br標簽的換行將不會縮進 
  4. </p> 
  5. <p>第二段使用p標簽段落首行也會縮進<br /> 
  6. 第二行使用了br不會縮進<br /> 
  7. 第三行提行使用了br也不會縮進</p> 
  8. </div> 

3、段首縮進案例截圖

div+css text-indent段落首行文字縮進應用案例截圖
div+css text-indent文本段落縮進應用案例截圖

三、首行段落文字縮進text-indent總結   -   TOP

我們要讓每段文字開頭縮進,并且可以控制縮進距離我使用text-indent縮進單詞。如果不想使用text-indent樣式進行縮進,我可以使用空格來實現,但需要多打幾個html空格字符&nbsp;”實現空格字符占位縮進,你可以詳細了解html多空格字符應用。

如需轉載,請注明文章出處和來源網址:http://www.khijtf.live/rumen/r400.shtml

如對文章有任何疑問請提交到DIV CSS論壇,或有任何網頁制作CSS問題立即到CSS論壇發貼求解 或 直接DIVCSS5網頁頂部搜索遇到DIVCSS疑問。
CSS教程文章修訂日期:2018-08-14 17:37 原創:DIVCSS5
本文www.khijtf.live DIVCSS5版權所有。

江西多乐彩走势图今天