iT邦幫忙

鐵人檔案

2022 iThome 鐵人賽
回列表
影片教學

從麻瓜變成前端魔法師 系列

從0開始學HTML、CSS、JavaScript。【每天5分鐘】學前端的影片版本

參賽天數 13 天 | 共 30 篇文章 | 9 人訂閱 訂閱系列文 RSS系列文
DAY 1

Day01【從麻瓜變成前端魔法師】安裝 VS Code + Live Server

影片終於弄出來了~~~感動 ヽ(*´∀`)ノ゚體驗到當 YouTuber 真是不容易 從來沒錄製過 教學影片 ,之前有查好該怎麼錄影今天錄完還一面上網爬文要怎...

2022-09-16 ‧ 由 Olivia 分享
DAY 2

Day02【從麻瓜變成前端魔法師】HTML 簡介

HTML(架構):好比房子的鋼筋、水泥、磚頭CSS(樣式):就像房子的裝潢、油漆JavaScript(動態效果):霍爾的移動城堡,跑起來~~ 如何快速生...

2022-09-17 ‧ 由 Olivia 分享
DAY 3

Day03【從麻瓜變成前端魔法師】HTML 標籤

有一部分字幕是簡體字沒有改到繁體字 若有錯字還請大家多多包涵,謝謝我會認真研究快速上繁體字的方法的 (> _ <); 若想知道更多資訊,可參考文...

2022-09-18 ‧ 由 Olivia 分享
DAY 4

Day04【從麻瓜變成前端魔法師】HTML 表格 table

今天要來做下圖這樣的表格 附上 CSS 樣式設定 <style> table, th, td{ border: 1px...

2022-09-19 ‧ 由 Olivia 分享
DAY 5

Day05【從麻瓜變成前端魔法師】HTML 表單 form (上集)

★ 註: <label> for 和 <input> id 值設定 一樣 就能夠 綁定 ,不要真的打上星星符號啊~囧 我們來練習做下圖...

2022-09-20 ‧ 由 Olivia 分享
DAY 6

Day06【從麻瓜變成前端魔法師】HTML 表單 form (中集)

接續上集 附上連結 Day05【從麻瓜變成前端魔法師】HTML 表單 form (上集) 我們來練習做下圖這樣的表單: 因為是 【每天5分鐘】學前端 的影片...

2022-09-21 ‧ 由 Olivia 分享
DAY 7

Day07【從麻瓜變成前端魔法師】HTML 表單 form (下集)

接續上集附上連結 Day05【從麻瓜變成前端魔法師】HTML 表單 form (上集) 、Day06【從麻瓜變成前端魔法師】HTML 表單 form (中集)...

2022-09-22 ‧ 由 Olivia 分享
DAY 8

Day08【從麻瓜變成前端魔法師】CSS 簡介

實作 3 種新增 CSS 方式 在 HTML 檔案內部: 行內樣式 在 HTML 檔案內部: 使用 <style> 標籤,內嵌式 在 HT...

2022-09-23 ‧ 由 Olivia 分享
DAY 9

Day09【從麻瓜變成前端魔法師】CSS 選取器

常用選取器介紹 通用選取器(又稱星號選取器) 元素選取器 類別選取器 ID 選取器 屬性選取器 HTML 和 CSS 註解寫法 比較。 <!-- 我...

2022-09-24 ‧ 由 Olivia 分享
DAY 10

Day10【從麻瓜變成前端魔法師】CSS box model & 開啟開發者工具

box model margin 外距 : 元素 & 元素 之間的距離border 邊框 : 存在於 外距 & 內距 之間padding 內...

2022-09-25 ‧ 由 Olivia 分享