昨天教了文字樣式今天則是文字段落,主要還可以使用css來調整字元間距、行高、文字對齊等等,這些都是在排版上很重要的細節,尤其是行高的部分,若是行高過小會讓閱讀上感到吃力,過大則會讓文章看起來支離破碎,這些都需要多加練習與調整。
「字元間距」屬性 (letter-spacing) 用於調整文字字元之間的水平距離。它的預設值為 normal,也就是瀏覽器預設的標準間距。
若想自訂間距,可以指定一個具體的長度 ,並搭配常用的單位,例如 px (像素)、em (相對單位) 或 cm (公分)。
格式:{letter-spacing}
範例:{ letter-spacing: -2px; }
用來設定每一行文字的高度,也就是行跟行之間的距離,常常會用在調整區塊的高度、圖片的高度、表格的高度或者是文字輸入欄位的高度等,也可以使用數字來調整
可以使用auto來讓瀏覽器自動判斷網頁元素高度
格式:{line-height: value}
範例:{ line-height: 2.5; }
設定文字在容器內的水平對齊方式,可以設定left為左對齊、right為右對齊、center為置中對齊或是justify為左右兩端對齊。
格式:{text-align: value}
範例:{text-align: center}
用來設定單字與單字之間的距離(主要對英文等以空格分詞的語言有效)。
格式:{word-spacing: length}
範例:{ word-spacing: 10px; }
設定段落第一行文字的縮排距離,可以使用負值,如果使用負值,則會使第一行文字向左縮排。
格式:{text-indent: length}
範例:{text-indent: -10px}