此篇會將響應式斷點設計拆為以下三個部分來介紹。 viewport 尋找容器 設置斷點 viewport 定義:網頁的可視區域,代表使用者能看到的網頁範...
Constraints 是 Figma 中一個很重要的功能,它可以讓我們的設計在做拉伸的時候,變的更加彈性,當你需要做 RWD (Responsive Web...
上一篇介紹了格線系統的概念及計算方式,擁有了這些觀念後會如何運用在繪圖軟體上呢?無論你是使用 Sketch 或是 Adobe XD 都可以快速建立如前文所提到的...
上一篇文章:MIS2000Lab.的「HTML5 從零開始」#24-- 自適應使用者介面(Adaptive User Interface)#1 http://i...
除了昨天提到的media query可以做出響應式網頁之外,今天介紹的Bootstrap 5.1版本也能快速上手,更輕鬆的做出排版喔! Containers 容...
網頁大小版要怎麼規劃呢?在設計稿階段,因為過去工作的關係,比較習慣提桌機版及手機版兩個尺寸。但進入切版階段後,就必須實現每個尺寸下畫面都是符合需求的,所以我會利...
昨天已經初步介紹幾個簡單常用的bootstrap語法,今天來看看幾個也是好用、比較詳細或特殊的情況。 col可以先空幾欄嗎 使用 offset-斷點-欄數,可以...
前幾天教了一些基礎概念和如何安裝,今天就來個小應用來告訴各位要如何實際應用吧~! 首先創一個.html的文件,然後按照Day3的步驟引入Vue。 html 再來...
今天要來說說RWD響應式網頁,應該大部分的人都有聽過或知道RWD這個名稱,他是現在網頁設計趨勢最基本需要具備的設計原則,幾乎可以說近年來的網站都會實現RWD或大...