fbpx

[免費課程] 什麼是 FLEXBOX?!

Contents

一個簡單、免費20個影片的課程,助你精通CSS Flexbox! 

線上觀賞 20 個教學影片 且 下載所有練習 !

和 102,000+ 全球同學們一起跟Wes Bos 學習

這是什麼? 

前13個影片主要是讓你瞭解 Flexbox 的基礎 – 我們將深入探索 rows、columns 、axes、wrapping、alignment、centering和 layout。後面7個是程式碼,從導航到行動應用程式的佈局完全運用Flexbox創建所有。

 Wes Bos 是誰? 

Wes Bos 是一位加拿大的全端開發者與教育家。 Wes喜歡將複雜的主題拆分成簡短、可口 、容易了解的教程。 他在Smashing Magazine、CSS Tricks 和 NetMag都有技術分享

你將跟著本課程創建什麼?

你將完全運用Flexbox建立以下事物:

wb-mobileapplayout
wb-flexboxPricingGrid
wb-inlinebookingform

 

所有教學影片

1

什麼是FLEXBOX介紹

2

介紹FLEXBOX

3
如何用 FLEX-DIRECTION
4

用FLEXBOX打包元件

5
FLEXBOX ORDERING
6
用JUSTIFY-CONTENT對準
7
用ALIGN-ITEMS對準/中
8
用ALIGN-CONTENT對準/中
9
用ALIGN-SELF對準
/中
10.jpg
以FLEX PROPERTY調大小
11
FLEX-GROW, FLEX-SHRINK, FLEX-BASIS
12
如何讓FLEX-BASIS 和打包一起作業
13.jpg
跨瀏覽器支援與AUTOPREFIXER
14
純FLEXBOX瀏覽程式碼
15.jpg
行動內容重排順序
16
嵌套FLEXBOX做垂直與水平置中
17
報價網格
18
同高度欄和留白元件
19
單行表單
20.jpg
建立行動應用的佈局
 

聽聽上過課的學生說什麼?

wb-comment1
wb-comment2
wb-comment4.png
wb-comment3.png

課程網址

更多 Wes Bos 線上課程介紹

訂閱開源報報

🎈您有以下困擾?

  • 時間繁忙,沒有時間仔細閱讀開源專案的介紹
  • 被社群媒體演算法掌控,只會看到同溫層主題的開源專案分享
  • 英文閱讀能力不好,又想要快速閱讀開源專案介紹
  • …..

開源報報使用 Patron 訂閱平台,無廣告,周一到週五每天三篇中文開源專案報導

Become a Patron!

也許你會有興趣

喜歡我們的服務與分享嗎?歡迎使用以下的社群分享按鈕分享給你的朋友吧!

發表迴響

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料

Powered by WordPress.com.

Up ↑

%d 位部落客按了讚: