CSS 是一種用于修飾 HTML 頁面的樣式表語言,其外聯方式有多種。在本文中,我們將介紹如何通過外聯 CSS 文件來為 HTML 文檔添加樣式。
首先,創建一個 CSS 文件,將文件命名為“style.css”或你喜歡的其他名稱,將文件保存在與 HTML 文件相同的目錄下。然后,在 HTML 文件中使用 link 標簽將 CSS 文件與 HTML 文檔關聯起來。link 標簽通常放置在 HTML 文檔的 head 標簽中。示例代碼如下:
<head> <link rel="stylesheet" type="text/css" href="style.css"> </head>
在 link 標簽中,rel 屬性指定關聯的文件類型為樣式表,type 屬性指定文件的 MIME 類型為 text/css。href 屬性指定 CSS 文件的路徑。通常,.css 擴展名的 CSS 文件將被識別為樣式表文件。
現在,我們可以在 CSS 文件中編寫樣式規則。示例代碼如下:
body { background-color: #f0f0f0; font-family: Arial, sans-serif; font-size: 16px; line-height: 1.5; } h1 { color: #333; font-size: 24px; font-weight: bold; margin-top: 20px; }
在上述例子中,我們定義了兩個樣式規則,一個是應用于頁面的 body 元素,另一個是應用于 h1 元素。該規則包括了元素的樣式定義,例如背景顏色、字體、字號、行高、顏色、字重和上邊距等。
最后,在 HTML 文件中使用對應的標簽,將樣式應用于頁面元素。示例代碼如下:
<body> <h1>這是一個標題</h1> <p>這是一段文本</p> </body>
在上述例子中,頁面中的 h1 和 p 元素將應用與其相對應的樣式規則。通過這種方式,我們可以輕松地通過外聯 CSS 文件來為 HTML 文檔添加樣式,實現更加美觀和易于閱讀的頁面效果。
上一篇IT專業PHP
下一篇ittun 解析php