在 html 中引用 css 文件可將樣式信息鏈接到網(wǎng)頁,控制其外觀和布局。具體步驟包括:創(chuàng)建一個 “.css” 擴展名的 css 文件。在 html 文件的
部分中使用 <link> 標簽引用 css 文件,指定 rel=”stylesheet” 和 href=”style.css”。可鏈接多個 css 文件。可使用媒體查詢加載不同尺寸或設(shè)備的特定樣式表。
HTML 中引用 CSS 文件
在 HTML 中引用 CSS 文件是一種將樣式信息鏈接到網(wǎng)頁的方式,以控制網(wǎng)頁的外觀和布局。以下是引用 CSS 文件的步驟:
1. 創(chuàng)建一個 CSS 文件
在文本編輯器中創(chuàng)建一個新文件,并使用 “.css” 作為文件擴展名。在文件中添加 CSS 樣式規(guī)則。
2. 在 HTML 文件中引用 CSS 文件
在要應(yīng)用樣式的 HTML 文件的 部分中,使用
<link>
標簽引用 CSS 文件:
<code class="html"> <link rel="stylesheet" href="style.css"></code>
登錄后復(fù)制
rel=”stylesheet” 指示瀏覽器該文件是一個樣式表。
href=”style.css” 指定了 CSS 文件的路徑。
3. 鏈接多個 CSS 文件(可選)
如果需要,可以使用多個 <link>
標簽鏈接多個 CSS 文件。它們將在鏈接的順序中應(yīng)用到網(wǎng)頁上。
4. 媒體查詢(可選)
可以添加媒體查詢以在不同的屏幕尺寸或設(shè)備上加載不同的樣式表。使用 media
屬性進行設(shè)置:
<code class="html"><link rel="stylesheet" media="screen and (max-width: 600px)" href="mobile.css"></code>
登錄后復(fù)制
當(dāng)屏幕寬度小于或等于 600px 時,將加載 “mobile.css”。
注意:
CSS 文件的路徑相對于 HTML 文件的位置。
<link>
標簽可以放在 部分的任何位置,但通常放在頭部開始處。
確保 CSS 文件名和路徑正確,否則樣式不會被應(yīng)用。