系列文章
Day21 響應式網頁設計(RWD)
Responsive web design (RWD) 響應式網頁設計 是種解決『裝置範圍』和『裝置尺寸』的設計方法，無論內容是在平板電腦、手機、電視或手錶上查...
Day22 媒體查詢 Media Queries
繼上篇介紹 RWD，這篇來看看媒體查詢Media Queries Level 4（2021/12）目前為 W3C Candidate Recommendatio...
Day23 路上的朋友，UI Framework
UI Framework，(User Interface Framework)，是為開發者提供了預設的 HTML、CSS 和 JavaScript 元件，以快速...
Day24 預處理器 SASS，我們是朋友嗎？
初次接觸 SASS（Syntactically Awesome Style Sheets）時，可能只有一頁設計稿，並且沒有特別感受到它的威力。相反地，花了很多時...
Day25 跨瀏覽器兼容性，切版與瀏覽器
身為前端就是跟『瀏覽器』有著萬縷千絲的關係，當然要跟『瀏覽器』大大好好相處，不同的瀏覽器，例如 Google Chrome、Mozilla Firefox、Mi...
Day26 網頁性能優化：關於 CSS 的部分
雖然還沒碰過被要求效能 a 代誌，但在 Code-Review 中也會被問這有必要用嗎？例如：常用的無敵星星，在 reset 上很好用，以及謠傳權重不要選太層次...
Day27 定位方案(Positioning Scheme)-Normal Flow、Float、Absolute Positioning
在Day11 Visual Formatting Model 淺談視覺格式化模型探討到，Positioning scheme 中有 normal flow、fl...
Day28 FlexBox 彈性盒子
基本概念 主軸和交叉軸 Flexbox 容器有兩個重要的軸，即主軸和交叉軸。主軸是 Flexbox 排列元素的主要方向，而交叉軸是與主軸垂直的方向。 主軸對齊...
Day29 網格佈局 Grid Layout
隨著技術的不斷發展，能夠實現更複雜和美觀的設計，引領潮流的技術是網格佈局（Grid Layout）是種用於排列網頁內容的靈，更易於地實現多欄、多行的佈局。 基本...
Day30 完賽感想與系列目錄
當開始擬大綱，回顧決定轉跑道所做的努力和歷程，從打開技術書就像看天書，頭疼不已的狀態，到寫技術文分享，而這過程，除了技術，有太多收穫了，當回想如何學習的並持續深...