w3cschool 在線教程(w3cschool視頻教學)

html中如何實現段落首行懸掛

一般我們需要對文章段落進行首行縮進的時候，都是使勁的按空格鍵。現在學會了HTML和CSS后，想要在段落前面空兩個字的距離，可不要再不停按空格鍵了，可以用CSS來實現段落首縮進兩個字符的效果。這里我們需要使用首行縮進CSS text-indent 屬性。text-indent可以使得容器內首行縮進一定單位。比如中文段落一般每段前空兩個漢字的距離。在這里我們需要了解一種長度單位em。em是相對長度單。相對于當前對象內文本的字體尺寸。我們中文段落一般每段前空兩個漢字。實際上，就是首行縮進了2em。代碼如下：

<styletype="text/css"><!--
p{
text-indent:2em;/*em是相對單位，2em即現在一個字大小的兩倍*/
}
--></style>

<p>W3Cschool在線教程（w3cschool.cn）-學技術，從W3Cschool開始！W3Cschool主要為初學者技術的人員提供在線學習教程和日常技術資料查詢服務。為了能更好的服務用戶，網站平臺中提供了大量的在線實例，通過實例，可以更好地學習如何建站。平臺的內容全部看免費查看，并且會根據當前互聯網的變化實時更新內容。</p>

顯示效果如下：

用CSS實現段落首縮進兩個字符，實現首行縮進的通用方法是加四個小角空格。其實呢，用CSS樣式來定義更為高效。比如在style里定義如下縮進樣式：

.suojin{text-indent:2em}

在需要縮進的地方使用

class="suojin"

即可，比如用一個div定義一整塊段落首先縮進，凡在div區域里，瀏覽器一碰上p語句（即一個新段的開始），就會執行.suojin所定義的縮進。也可以在正文中使用嵌入式CSS樣式來定義，下面舉個實例：

<divstyle="text-indent:2em"><p>段落一</p><p>段落二</p><p>段落三<p></div>

效果如下：

兩種方法各有長處短處,可根據需要決定使用哪一種方法。

text-indent:2em;

解釋：text的意思是文本、indent在計算機英語中意思是縮進、至于后面的2em意思就是2個相對單位； em解釋：相對于當前對象內文本的字體尺寸。（引自CSS參考手冊）各位同學，要仔細品一下這個概念！理解了吧，em這個單位的意思就是相對文字大小，1em就是1個文字大小，2em就是兩個文字大小，到這里看明白了吧，理解“text-indent:2em;”的意思了吧，就是“文本縮進兩個文字大小”，這不就是我們要的效果么？

注：div標簽不要忘記起始符。text-indent只對p標簽或div標簽有效，對br標簽不生效，原因是br標簽是換行標簽不是分段標簽。

w3school和w3cschool兩個網站有什么關系和區別

w3school是06年注冊的，而w3cschool是09年注冊的。
其中w3cschool是應w3c中國組織官方而出的，
而w3school是上海贏科投資有限公司進行投資的，
但是是為了協助w3c中國組織而出的
重點大家應該也看出來了，就在這個“協助”二字。
結果不言而喻，都為了免費服務大眾罷了，
可能先前的那些類似相同的都是直接w3c照搬過來，
但是之后的內容就不會再給予相同的了。
而w3school涵蓋內容較多，但w3cschool的樣例說明比w3school要豐富