真的能「動手做網頁」
的技能
一般課程都很簡單:
「教你做一個按鈕,下課」
「教你做版面置中,下課」
然而很多眉眉角角、在工作的時候,才會跑出來找你麻煩。
所以這門課,先從 HTML、CSS 的基礎、屬性、特色、彼此搭配的效果,好好做一個說明。
緊接著透過實戰、透過多年的經驗,把真實的網頁畫面一個一個刻畫出來。除了寫 code 以外,也讓你看看工程師在寫 code 之前,是如何規劃網頁的。
讓你真正體驗到 HTML+CSS 的奧秘。
HTML + CSS 很簡單?
大家剛接觸 HTML 跟 CSS 都覺得很簡單、很好入手,因為隨便寫一寫都會有畫面。
但真的在工作、接案的時候,常常發現畫面跟我們想像的不一樣:問題一大堆,卻不知道要怎麼修正。因為我們從來沒有認真的去了解 「HTML 架構」跟「CSS 屬性」真正的用法。
看似簡單的技術,需要多年的經驗、研究,才能真正的理解。而現在,我們就把這些經驗,全部分享給你!
HTML 架構
擁有好的 HTML 架構
就能很輕鬆的做出想要的畫面
CSS 屬性
對 CSS 一知半解,做不出想要的畫面,還越寫越生氣
唯有完全的理解,才能有條理的做出想要的畫面
HTML+CSS 的搭配
兩個看似分開的東西,卻是很重要的搭配。有好的 HTML 架構、對 CSS 的清楚理解,才能做出好的網頁
課程大綱
Available in
天
天
在你加入課程之後
Available in
天
天
在你加入課程之後
Available in
天
天
在你加入課程之後
Available in
天
天
在你加入課程之後
Available in
天
天
在你加入課程之後
- 【CSS 練習 #1 / 檔案下載】
- 加入 CSS 檔案 (12:15)
- Container / 水平置中 #1 (6:08)
- Navigation / 圖片的問題 / 垂直置中 (17:27)
- clearfix (8:24)
- Hero section & 產品分類 / Grid 的概念 (22:45)
- 最新產品 / 細節調整 (21:33)
- 最新產品 / 覆蓋文字 (18:30)
- 【CSS 練習 #2 / 檔案下載】
- event 段落 / background-image / 細節調整 (14:32)
- featured 段落 (15:39)
- featured 段落 / margin collapse (10:09)
- outlets 段落 (6:54)
- footer / 水平置中 #2 (15:50)
- go top 回到頂端 (4:50)
- CSS 回顧 (2:39)
Available in
天
天
在你加入課程之後
打好基礎,才能走得更遠
HTML + CSS 是網頁最基礎的技術,學好了 HTML 基礎架構、正確的 CSS 屬性,我們才能好好的控制網頁畫面,後續 Javascript 的加入,才能更順利的做出我們需要的功能。
相關課程
有了 HTML+CSS 基礎
我們就可以繼續往下學習
感謝訂閱,記得收 Email 確認我們的訂閱。