第十一屆

self
從門外漢到前端新手
JinWen

系列文章

DAY 1

Day1 前端自學心得-萬事起頭難

自學之前的掙扎 想學網頁前端,卻像在大海中迷航,不知道從何下手嗎?這30篇文章為我的學習做筆記,也分享給自詡為門外漢的你。從準備自學,到開始自學,最後可以執行基...

DAY 2

Day2 什麼是web前端

網站工程 架設一個網站的工程(這邊講的是網站架設工程,不包含網頁視覺設計)主要分成兩大區塊:前端與後端。 前端工程負責網頁的門面,看得到的文字、顏色、連結、分頁...

DAY 3

Day3 推薦的前端學習資源

完全門外漢的初階學習資源 在對於網頁前端領域完全陌生的情況下,要自己看懂教學文章是很吃力的(但也不是不可能,有人做得到,但對我來說真的很難。 以下是我在完全零基...

DAY 4

Day4 動手寫HTML之前(上)

首先就來了解網路的運作吧!點圖看影片 How The Internet Works: HTML是什麼 超文本標記語言(英語:HyperText Markup...

DAY 5

Day5 動手寫HTML之前(下)

上一篇我們說到元素的特性,介紹了inline元素跟block元素。今天就來介紹: 替換元素與非替換元素 文檔的層級概念 替換元素&非替換元素 替換元...

DAY 6

Day6 動手寫HTML(1)

打開文字編輯器 *還不會用VS code的話請看第3天文章有提到的教學。 這裡示範的文字編輯器是VS code,新增一個檔案,先將它存成Html檔,這樣編輯器才...

DAY 7

Day7 動手寫HTML(2)

標籤語意的重要性 在瀏覽器的世界,雖然很多元素的視覺效果可能很像,可是針對網站的每個不同內容下好的元素很重要。它會幫助瀏覽器讀取文檔,讓網路體驗更優化。 進...

DAY 8

Day8 動手寫HTML(3)

上篇介紹了很多結構文字內容的元素,今天就來介紹些引入外部資源的常用元素吧。 <img> 在HTML裡,我們用<img>來嵌入圖片,它不需...

DAY 9

Day9 動手寫HTML(4)

語意化標籤 我們學到,標籤的語意是撰寫html文檔時,很重要的概念。而HTML5版本,有所謂的語意化標籤,這類元素並不像<input>、<a&...

DAY 10

Day10 如何套用CSS

會寫HTML了,可是放在瀏覽器看起來卻很單調,接下來就可以用CSS幫它做樣式,之前從CSS zen garden可以看出,CSS的功能是很強大的,可以做出各式各...