如果說 HTML 負責骨架，那 CSS (Cascading Style Sheets) 就是網頁的皮膚、衣服和化妝品。它決定了網頁的顏色、字體、排版等視覺呈現。從今天開始，我的網頁將不再只是黑白，而是充滿色彩和設計感。
學習如何將 CSS 應用到 HTML 上，主要有三種方式：
1. 行內樣式 (Inline Style)： 直接在 HTML 標籤內使用 style 屬性。
<h1 style="color: blue;">我的標題</h1>
2. 內部樣式 (Internal Style)： 在<head>標籤內使用<style>標籤。
HTML
<head>
<style>
h1 {
color: blue;
}
</style>
</head>
3. 外部樣式 (External Style)： 這是最推薦的方式！將 CSS 程式碼寫在一個獨立的 .css 檔案中，然後在 HTML 檔案中連結它。
HTML
<head>
<link rel="stylesheet" href="style.css" />
</head>
建立一個 style.css 檔案，並將它連結到我們昨天的 HTML 頁面。
在 index.html 的 <head> 標籤內加入：<link rel="stylesheet" href="style.css" />
在 style.css 檔案中加入：
CSS
body {
background-color: #3e81bc;
}
h1 {
color: #f5f5f5;
}
打開網頁會發現背景變成了深藍色，標題也變成了灰白色。這就是CSS風格的厲害，讓網頁變得更加美觀、有吸引力。明天會更深入地探索CSS的顏色屬性。
執行成果 :
iThome鐵人賽
看影片追技術
看更多