在前端開發過程中,CSS樣式表文件的引入是非常重要的一步。通過CSS樣式表,我們可以對HTML頁面進行樣式修飾和美化。接下來,我們將介紹如何將CSS文件引入到HTML中。
<!DOCTYPE html> <html> <head> <title>CSS文件引入示例</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <h1>Hello World!</h1> <p>This is a paragraph.</p> </body> </html>
在上面的示例中,我們可以看到在HTML文檔的頭部(<head>標簽內)引入了一個CSS文件,CSS文件的路徑是相對于HTML文件的路徑:
<link rel="stylesheet" type="text/css" href="style.css">
其中:
- rel="stylesheet":表示引入的是一個CSS樣式表文件;
- type="text/css":表示引入的文件類型為CSS樣式表;
- href="style.css":表示引入的CSS文件的路徑。
CSS文件通常會單獨存放在一個文件夾中,并命名為“style.css”或“main.css”等名稱。
需要注意的是,在HTML文檔中,引入CSS文件應該在<head>標簽內,而不是在<body>標簽內或其他標簽內。
總的來說,將CSS文件引入到HTML文檔中非常簡單,只需要在<head>標簽內添加一行代碼即可。