CSS(層疊樣式表)是一種用于控制HTML(超文本標記語言)文檔外觀和布局的樣式表語言。在HTML5中,CSS可以用來創建網頁的樣式,為網站提供吸引人的外觀和良好的用戶體驗。
要在HTML5中使用CSS,需要將CSS樣式表嵌入在HTML頭部中。這可以通過在 <head> 標簽內使用 <style> 標簽來實現,如下所示:
<head> <style> body { background-color: #f0f0f0; color: #333; font-family: Arial, sans-serif; } h1 { color: #ff0000; font-size: 2em; } </style> </head>
上述代碼指定了網頁主體背景顏色、文本顏色和字體類型,以及標題顏色和字體大小。這些樣式應用于整個HTML文檔和其中的元素。
為了更好地組織和管理CSS樣式,可以在HTML文件外部創建一個獨立的CSS文件,然后將其鏈接到HTML文檔中。這可以通過在HTML頭部使用 <link> 標簽來實現,如下所示:
<head> <link rel="stylesheet" href="style.css"> </head>
上述代碼將鏈接一個名為“style.css”的CSS文件。在該文件中,可以使用CSS選擇器來選擇需要樣式化的元素,并指定樣式屬性和屬性值,如下所示:
/* 選擇所有段落元素 */ p { color: #333; font-size: 1.2em; line-height: 1.5; } /* 選擇類名為“highlight”的元素 */ .highlight { background-color: #ffdfba; border: 1px solid #ffcc80; } /* 選擇ID為“header”的元素 */ #header { font-size: 2em; text-align: center; margin-bottom: 1em; }
上述代碼為所有段落元素指定了文本顏色、字體大小和行高,為類名為“highlight”的元素指定了背景顏色和邊框樣式,為ID為“header”的元素指定了字體大小、文本對齊和底部外邊距。使用CSS選擇器和樣式屬性,可以為HTML頁面設計出各種不同的風格和效果。