- 練習十個 flex 排版方式，因為一個人打十份排版，所以直接以
我要打十個 !! Flex 十大高手做為主視覺區塊的主題設計。 - 正好是葉問電影系列的《葉問4：完結篇》做為最後的一部，取用電影系列中較有涵意的台詞結合，做一些經典片段回顧。
- 完整性為出發展與製作風格主題，將列表頁與主題風格結合。
- 以共用樣式為基底，將十題十頁視為一整個專案，為了好區分專頁樣式命名加入
.typeXX來視別專頁。 - 工具類樣式、元件化樣式 (
.typeXX-c移除.typeXX可視為全域使用)。 - 樣式元件化架構樣式可讓元素的 class 架構與更乾淨，子孫層可以透過元件化少用到工具類樣式，調整架構更針對性，當然也可以視為架構上工具類的集合包。
- 使用 CSS 命名設計模式。
- 以 CSS 簡易能達到效果為主，錨點的使用與 hover 觀念。
- Sass/Scss 不使用，刻意練習 CSS 與命名。
- flex 排版與應用為主。
- 內頁以了解 flex 彈性特性為主，
.typeXX-range為設計稿尺寸，盡可能相近畫面。 .typexx-range與相近元素的樣式名稱移除後，可以看到 flex 的廷展性。