如何在 HTML 中使用內聯 CSS(樣式表)?


層疊樣式表用於設定網頁的呈現樣式。

CSS 用於設定網頁的樣式和佈局——你可以透過使用它來控制網頁的呈現樣式,包括改變字型、顏色、尺寸和內容間距、將其拆分為多列或增加動畫和其他 CSS 特性中提供的裝飾性功能。

  • 內聯——在 HTML 元素內使用樣式屬性。

  • 內聯 CSS——內聯 CSS 用於對標籤內使用的單個 HTML 元素應用獨特的樣式。

示例

以下是一個示例程式,它在 HTML 中使用內聯 CSS 進行樣式設定。

<!DOCTYPE html> <html> <head> <h1 style="font-family: fantasy">HTML</h1> </head> <body style="background-color: bisque"> <p style="background:yellow" >HTML is used to structure a web page and its content.</p> </body> </html>

示例

以下是一個示例程式,它為 <h1> 和 <h2> 元素使用內聯 CSS 進行樣式設定。

<!DOCTYPE html> <html> <head> <h1 style="font-family: fantasy">HTML</h1> </head> <body style="background-color: seagreen"> <h2 style="background:whitesmoke" >HTML is used to structure a web page and its content.</h2> </body> </html>

示例

以下是一個示例程式,它為 <table> 元素使用內聯 CSS 進行樣式設定。

<!DOCTYPE html> <html> <head> <title>Inline CSS</title> </head> <body> <table style = "border: 1px solid";> <tr> <th>Firstname</th> <th>Lastname</th> </tr> <tr> <td>Peter</td> <td>Griffin</td> </tr> <tr> <td>Lois</td> <td>Griffin</td> </tr> </table> </body> </html>

更新日期:11-11-2022

3K+ 瀏覽量

開啟你的 職業生涯

完成課程,獲得認證

立即開始
廣告
© . All rights reserved.