1. Mobile First 設計

    https://s3-us-west-2.amazonaws.com/secure.notion-static.com/ee5e52c0-7588-433a-a0c2-e2a61130adf7/image_1.png

  2. Breakpoint

    https://s3-us-west-2.amazonaws.com/secure.notion-static.com/7eaab2cb-f7cd-4c03-8759-bb532a5a308b/image_3.png

    主要分界點負責大排版變化，次要分界點負責細部的設計優化

  3. 媒體查詢 media queries

  4. 需在 <head> 加入

    <meta name="viewport" content="width=device-width, initial-scale=1">