CSS(層疊樣式表)是用于給HTML頁(yè)面添加樣式和布局的語言。在編寫HTML頁(yè)面時(shí),可以把CSS代碼嵌入到HTML文檔中,也可以將CSS代碼鏈接到HTML文檔中的外部文件中。
嵌入式CSS代碼可以使用<style>標(biāo)簽嵌入到HTML頁(yè)面中。例如:
<html> <head> <title>我的網(wǎng)頁(yè)</title> <style> body { font-family: Arial, sans-serif; background-color: #f2f2f2; } h1 { color: #333333; text-align: center; } </style> </head> <body> <h1>歡迎來到我的網(wǎng)頁(yè)</h1> <p>這是一個(gè)演示如何使用CSS來設(shè)置HTML頁(yè)面樣式的網(wǎng)頁(yè)。</p> </body> </html>
在上面的例子中,我們?cè)?lt;head>標(biāo)簽中創(chuàng)建了一個(gè)<style>標(biāo)簽,然后在其中定義了一些CSS樣式。這些樣式會(huì)應(yīng)用于頁(yè)面中的元素,例如:body、h1等。
除了嵌入式CSS代碼,還可以將CSS代碼放在外部文件中,然后在HTML頁(yè)面中使用<link>標(biāo)簽進(jìn)行鏈接。例如:
//index.html <html> <head> <title>我的網(wǎng)頁(yè)</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <h1>歡迎來到我的網(wǎng)頁(yè)</h1> <p>這是一個(gè)演示如何使用CSS來設(shè)置HTML頁(yè)面樣式的網(wǎng)頁(yè)。</p> </body> </html> //style.css body { font-family: Arial, sans-serif; background-color: #f2f2f2; } h1 { color: #333333; text-align: center; }
在上面的例子中,我們將CSS代碼放在了一個(gè)名為style.css的文件中,并使用<link>標(biāo)簽將其鏈接到了HTML頁(yè)面中。
無論是使用嵌入式CSS代碼還是外部CSS文件,都可以幫助我們更簡(jiǎn)單、更方便地對(duì)HTML頁(yè)面進(jìn)行樣式和布局設(shè)置。