10 文字、段落、首字放大

在CSS中文字都是透過"font"的相關屬性進行設置。例:

<style type="text/css">
span{
font-family: 黑體; /* 文字字體 */
font-size: 40px; /* 文字大小 */
text-decoration:line-through; /* 刪除線 */
font-weight:bold; /* 粗體 */
font-style:italic; /* 斜體 */
color:#006600; /* 顏色 */
}
</style>

<span>顯示文字樣式</span>

在CSS中段落都是透過"line-height"屬性來設置段落行距，透過"letter-spacing"屬性來設置字元間距。例: 

<style type="text/css">
p.one{
    letter-spacing: 5pt;    /* 字元間距，絕對數值 */
    line-height:15pt;     /* 行間距，絕對數值 */
}

p.second, p.third{
    letter-spacing: 0.3em;  /* 字元間距，相對數值 */
    line-height: 2em;     /* 行間距，相對數值 */
}
</style>

<p class="one">段落一(請找一堆文字來填充)</p>
<p class="second">段落二(請找一堆文字來填充)</p>
<p class="third">段落三(請找一堆文字來填充)</p>

在CSS中首字放大效果是透過針對第一個字元進行單獨設置CSS樣式來實現。例:

<style type="text/css">
p span {
font-size:60px; /* 首字大小 */
float:left; /* 首字下沉 */
padding-right:10px; /* 與右邊文字間隔 */
}
</style>

<p class="one"><span>段</span>落一(請找一堆文字來填充)</p>



Comments