【前端開發】:行間距和首行縮進


1.行間距使用line-height屬性

2.首行縮進使用text-indent,單位為em,一個em就是一個漢字的寬度

3.文字居中使用text-align:center為居中,right則放到最右邊,left放到最左邊

代碼如下所示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>行間距</title>
    <style>
        p
        {
        line-height:50px;
        text-indent:2em;/# 2em就是兩個漢字的寬度  #/
        }
        h3
        {
        text-align:center
        }
    </style>
</head>
<body>
<h3>海賊王的創作背景</h3>
<p>《航海王》是日本漫畫家尾田榮一郎作畫的少年漫畫作品,於1997年7月22日在集英社《周刊少年Jump》開始連載。改編的電視動畫《航海王》於1999年10月20日起在富士電視台首播。
2012年5月11日,《航海王》獲得第41回日本漫畫家協會賞 [1]  。本作被吉尼斯世界紀錄官方認證為“世界上發行量最高的單一作者創作的系列漫畫” [2]  。2017年7月21日,日本紀念日協會通過認證,將每年的7月22日設立為“ONE PIECE紀念日” [3]  。
</p>
<p>
    這的確是一部十分偉大的電影,大家都非常喜歡觀看
</p>
</body>
</html>

顯示結果為:

 

 備注:使用首行縮進就可以將每一個段落都進行縮進,省去了很多麻煩事。

行內塊元素。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM