鐵人檔案
這系列文章會記錄我作為 Web 新手 的學習旅程～從最基本的網頁概念開始，一步步了解架構、設計到互動的原理！每篇文章都會分享我學到的知識與心得，讓更多和我一樣的初學者能一起入門。透過 30 天的挑戰，我希望把學習過程整理出來，不僅幫助自己複習，也能和大家一起更認識 Web 的世界！
對我來說，網頁不只是技術，它更像是一個充滿可能性的舞台。從最簡單的靜態頁面，到後來加入樣式讓頁面好看，再到現在可以做互動功能，網頁早已不只是呈現資訊的地方，而是...
今天重點：HTML 是網頁骨架，語義化標籤讓結構更清楚、維護更方便。今天想先從最基礎的 HTML 講起。簡單來說，HTML 就像網頁的骨架，負責把內容一個個排好...
在昨天 HTML 的語義化標籤後，我們已經為網頁打好了「骨架」。但是光有骨架，看起來就像是一棟沒有裝潢的空屋，雖然能住人，但沒有任何美感或舒適度。CSS 是專為...
在前幾天，我們已經的介紹了網頁「骨架」與語義化標籤，並認識 CSS的用途。當頁面上有很多元素時，如何告訴瀏覽器「這段樣式要套給誰」？答案就是 選擇器（selec...
在前幾天，我們已經認識了 HTML 的骨架與語義化標籤，並開始用 CSS 打扮網頁。今天要介紹的是CSS的盒模型（Box Model）——每個元素在網頁上占據空...
在前一天，我們了解了盒模型，知道每個元素都有內容區、內距、邊框和外距。今天來講區塊元素（block）與行內元素（inline）的差別，這對排版很重要。 1. 區...
前幾天我們學了 HTML 骨架、語義化標籤，還有 CSS 排版和盒模型，網頁看起來不會亂跑了。但如果只是整齊排列，網站還是有點單調。今天就來聊聊文字的顏色、字體...
在前面我們學過排版與顏色，已經能把網頁的基本結構和外觀建立起來。但如果畫面只有文字、顏色和簡單的排版，還是容易顯得平面、缺乏層次。今天我們要進一步學習一些能提升...
在前面幾天，我們已經學習使用區塊、行內元素，以及基本的 CSS 屬性來進行排版。然而，要讓元素平均分布、水平或垂直置中，傳統方法通常需要搭配 float、inl...
昨天我們學了 Flexbox，解決了很多像置中、平均分布這種以前很麻煩的排版問題。但如果整個網頁需要更完整的版面規劃，光靠 Flexbox 還是會有點吃力，這時...
