首頁 > web前端 > css教學 > 主體

css如何設定首行縮排2個字符

王林
發布: 2020-11-17 11:55:30
原創
10602 人瀏覽過

css設定首行縮排2個字元的方法:可以利用text-indent屬性來設定首行縮排2個字符,如【text-indent:2em;】。 text-index屬性用於規定文字區塊中首行文字的縮進,em是相對單位。

css如何設定首行縮排2個字符

相關屬性:

text-indent 屬性規定文字區塊中首行文字的縮排。

(影片教學建議:css影片教學

屬性值:

  • length    定義固定的縮排。預設值:0。   

  • %    定義基於父元素寬度的百分比的縮排。   

  • inherit    規定應該從父元素繼承 text-indent 屬性的值。   

實作程式碼:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>首行缩进</title>
		<style>
			.demo{
				width: 550px;
				height: 200px;
				margin: 50px auto;
			}
			p{
				text-indent:2em;/*em是相对单位,2em即现在一个字大小的两倍*/
			}
			}
		</style>
	</head>
	<body>
		<div class="demo">
		<p>
		这是一段测试代码,是关于css文本缩进的一段文字。这是一段测试代码,是关于css文本缩进的一段文字。
		这是一段测试代码,是关于css文本缩进的一段文字。这是一段测试代码,是关于css文本缩进的一段文字。
		这是一段测试代码,是关于css文本缩进的一段文字。这是一段测试代码,是关于css文本缩进的一段文字。
		</p>
		</div>
	</body>
</html>
登入後複製

相關推薦:CSS教學

以上是css如何設定首行縮排2個字符的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板