技術 Day18. 切版前知識(八) 響應式網頁(RWD) 大小版畫面規劃

網頁大小版要怎麼規劃呢？在設計稿階段，因為過去工作的關係，比較習慣提桌機版及手機版兩個尺寸。但進入切版階段後，就必須實現每個尺寸下畫面都是符合需求的，所以我會利...

技術 Day17. 切版前知識(七) 響應式網頁(RWD) 介紹

今天要來說說RWD響應式網頁，應該大部分的人都有聽過或知道RWD這個名稱，他是現在網頁設計趨勢最基本需要具備的設計原則，幾乎可以說近年來的網站都會實現RWD或大...

技術 Day 22. RWD 響應式設計的利器- 理解 Figma 的 Constraints 機制

Constraints 是 Figma 中一個很重要的功能，它可以讓我們的設計在做拉伸的時候，變的更加彈性，當你需要做 RWD (Responsive Web...

技術 30天打造品牌特色電商網站 Day.11 CSS框架-Bootstrap5

昨天已經初步介紹幾個簡單常用的bootstrap語法，今天來看看幾個也是好用、比較詳細或特殊的情況。 col可以先空幾欄嗎 使用 offset-斷點-欄數，可以...

技術 30天打造品牌特色電商網站 Day.10 CSS框架-Bootstrap5

除了昨天提到的media query可以做出響應式網頁之外，今天介紹的Bootstrap 5.1版本也能快速上手，更輕鬆的做出排版喔！ Containers 容...

技術 第 9 集：RWD 響應式斷點設計

此篇會將響應式斷點設計拆為以下三個部分來介紹。 viewport 尋找容器 設置斷點 viewport 定義：網頁的可視區域，代表使用者能看到的網頁範...

技術 [Day 4] 來個簡單的小應用唄~

前幾天教了一些基礎概念和如何安裝，今天就來個小應用來告訴各位要如何實際應用吧~! 首先創一個.html的文件，然後按照Day3的步驟引入Vue。 html 再來...

技術 網頁設計常用格線系統(下)

上一篇介紹了格線系統的概念及計算方式，擁有了這些觀念後會如何運用在繪圖軟體上呢？無論你是使用 Sketch 或是 Adobe XD 都可以快速建立如前文所提到的...

技術 MIS2000Lab.的「HTML5 認證考試，從零開始」#25-- 自適應使用者介面 #2

上一篇文章：MIS2000Lab.的「HTML5 從零開始」#24-- 自適應使用者介面（Adaptive User Interface）#1 http://i...