CSS裡的text-indent怎麼使用

來源:互聯網
上載者:User
CSS裡的text-indent使用很簡單,主要是看text-indent縮排文法與結構,那麼下面我們來給大家講解一下並且舉一個小案例,

text-indent縮排文法與結構

.div{text-indent:25px}

這裡div對象內段落首行開頭文字縮排了25像素。

css text-indent文本縮排樣式屬性單詞,text-indent的值跟數字+單位組成縮排樣式。通常text-indent縮排屬性將對段落首行開頭文本文字進行縮排顯示。如果使用html br換列標籤,第二個換行開始也不會出現縮排效果。如果使用了html P段落標籤段落換行,將會出現每個p段落換行開頭都將縮排,這裡我們給大家通過案例示範給大家,希望通過DIV案例掌握CSS text-indent縮排樣式。

1、CSS代碼

.div{ text-indent:35px}HTML程式碼片段<div class="div"> <p>第一段開始縮排效果<br /> 使用br標籤的換行將不會縮排 </p> <p>第二段使用p標籤段落首行也會縮排<br /> 第二行使用了br不會縮排<br /> 第三行提行使用了br也不會縮排</p> </div>

首行段落文字縮排text-indent總結

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

text-indent的使用方法就這麼多,需要的朋友可以儲存一下,也請大家持續關注本站的其他更新。

相關閱讀:

什麼是CSS


幾種純css製作的小功能執行個體


為什麼有時候DIV CSS載入失敗

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.