【前端】CSS 是什麼?

241219 CSS是什麼

上次的前端小教學,介紹了網頁的骨架 — HTML

這次讓我們來聊聊網頁設計中不可或缺的靈魂角色 — CSS .ᐟ.ᐟ.ᐟ ✨

🙋 CSS 是什麼?

CSS 是 Cascading Style Sheets 的縮寫,

中文稱「層疊樣式表」,

簡單來說,它是用來為網頁的 HTML 添加樣式的工具,

包括文字顏色、字體大小、背景顏色,甚至到 RWD(響應式設計),

讓你的網頁不論在手機還是電腦上看起來都很完美~✨

👩‍🎨 CSS 的基本結構?

一段簡單的 CSS 程式碼包括以下幾個部分:

🔺選擇器:用來指定想要套用樣式的 HTML 元素,例如 「h1」 或 「.classname」。

🔺宣告:由 「屬性」 和 「屬性值」組成,屬性決定要改變什麼(例如顏色),而屬性值則是設定具體的樣式(例如紅色)。

🙋 那要怎麼用 CSS 呢?

在網頁設計中,主要有兩種方式可以使用 CSS:

1️⃣ 直接寫在 HTML 的 <style> 標籤裡

⇨ 適合小規模的快速調整,但維護較困難

2️⃣ 建立一個獨立的 .css 檔案

⇨ 將樣式與 HTML 分開,方便維護與重複使用

從以上可以看出,CSS 是讓你的網頁從「黑白」變得「繽紛多彩」的關鍵,

學會它能讓你設計出更有吸引力的網站!🎨✨

之後,我們會進一步解析更多 CSS 的進階應用,敬請期待!