- <!DOCTYPE html>
- <html>
- <head>
- <link rel="stylesheet" href="style4.css">
- <title>文字排版範例</title>
- </head>
- <body>
- <h1>文字排版範例</h1>
- <h2>這裡是一個子標題</h2>
- <p>這是一個使用text-indent屬性的段落，可以設定首行縮排，這樣就可以使段落的第一行空出來，使文章更有層次感和美觀</p>
- <h2>使用連結</h2>
- <p>
- 這是一個包含連結的段落，你可以
- <a href="">點擊這裡</a>
- 來進一步了解更多內容
- </p>
- <h2>有序清單</h2>
- <ol>
- <li>第一項</li>
- <li>第二項</li>
- <li>第三項</li>
- </ol>
- <h2>調整行間距和字母間距</h2>
- <p style="line-height: 1;">這是一個使用line-height屬性設定為1的段落，行高和文字大小一致，這樣行間距會比較緊湊。</p>
- <p style="line-height: 24px;">這是一個使用line-height屬性設定為24px的段落，行高設定為具體的高度值，使行間距較大，提高閱讀舒適度。</p>
- <p>字母間距是設定字母之間的距離，使用letter-spacing屬性可以調整自母間距。</p>
- <P style="letter-spacing: 10px;">letter-spacing 10px</P>
- <p style="letter-spacing: 20px;">letter-spacing 20px</p>
- </body>
- </html>
|
