CSS外鏈式是一種在HTML文檔中引入CSS樣式表的方法,通過外鏈式,我們可以將樣式表與HTML文檔分開,提高代碼的可維護性和可讀性,在HTML中引入CSS外鏈式的方法如下:
1、創(chuàng)建CSS樣式表:我們需要創(chuàng)建一個CSS文件,用于存儲所有的樣式規(guī)則,我們可以創(chuàng)建一個名為styles.css
的文件。
2、在HTML中引入CSS樣式表:在HTML文檔的<head>
部分,使用<link>
元素引入CSS樣式表。
<head> <link rel="stylesheet" href="styles.css"> </head>
在上面的代碼中,rel="stylesheet"
表示該鏈接指向的是一個樣式表,href="styles.css"
則表示樣式表的文件路徑。
3、使用CSS樣式:在HTML文檔中使用CSS類名或ID來應用樣式,我們可以在<div>
元素中應用一個名為my-div
的類名:
<div class="my-div">這是一個帶有樣式的div元素</div>
在CSS樣式表中定義my-div
的樣式:
.my-div { color: red; font-size: 20px; }
通過以上步驟,我們就可以在HTML文檔中應用CSS外鏈式來設置元素的樣式了,這種方法使得樣式的應用更加靈活和可維護,同時也提高了代碼的可讀性。