iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

5 Like 1 留言 3101 瀏覽

鐵人賽開發技術 DAY 24

MIS2000Lab.的「HTML5 認證考試，從零開始」--菜鳥的30天馬拉松系列第 24 篇

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

=============================================== 本系列文章已經集結出書 HTML5、CSS、JavaScript...

mis2000lab ‧ 2014-10-19

2 Like 0 留言 3029 瀏覽

鐵人賽開發技術 DAY 28

你不能不知道的Polymer開發實戰系列第 28 篇

技術 Material Design - 自適應(RWD)鍵盤，有這種事?

今日目標: 拿計算機元件，組裝出RWD鍵盤自適應(RWD)網站、(RWD)圖片相信大家都聽過，但是RWD鍵盤沒聽過吧....今日就讓我們用昨日計算機的key...

martyshu ‧ 2014-10-18

2 Like 0 留言 2924 瀏覽

技術 [鼠年全馬鐵人挑戰] Week13 - 超新手學習筆記：如何開始撰寫 RWD

又過了一週啦~一樣是超忙的一週~~下班回家努力練習切版直播的作業，不過這次的版型比較複雜所以卡關了QQ真的是燒腦燒到一個極點這次的作業除了 PC 版之外，還需練...

a841722 ‧ 2020-05-03

0 Like 0 留言 2769 瀏覽

鐵人賽 Modern Web DAY 9

我說那個手機版系列第 9 篇

技術 [Day 9] Flexbox 的使用姿勢 Part 3

你所不知道的「補白」首先，你必須要知道這幾個常用屬性的可用值，屬性預設值可用值 justify-content normal flex-s...

閃光洽 ‧ 2020-09-23

0 Like 0 留言 2705 瀏覽

鐵人賽 Modern Web DAY 5

我說那個手機版系列第 5 篇

技術 [Day 5] 從內容開始看格線系統

內容為王如果以現在的趨勢來看，應該叫「廣告為王」。當然我不會設計，所以也就不會設計廣告。網站主要的目的，是要傳達內容，所以關於文件流、斷點、區塊設計這些...

閃光洽 ‧ 2020-09-19

2 Like 0 留言 2679 瀏覽

技術領進前端門，修行在個人：一變應萬變的響應式網頁設計(1) - 基本環境、觀念

基本環境建立因為各個不同的手機有不同的寬度，如下圖如果要符合每個不同的解析度去做開發，會導致開發上非常困難，所以需要加入以下這段語法 <meta nam...

yaling_0616 ‧ 2020-06-23

1 Like 2 留言 2601 瀏覽

鐵人賽 Modern Web DAY 1

我說那個手機版系列第 1 篇

技術 [Day 1] 我說那個手機版

說在最前面網頁這種萬年老埂應該是沒什麼人會看，會想要撰寫這種偏冷門的東西，純粹是個人比較邊緣的關係。目前市面上各種關於網頁製作、切版的工具五花八門，真的會想手...

閃光洽 ‧ 2020-09-15

0 Like 0 留言 2496 瀏覽

鐵人賽 Modern Web DAY 11

我說那個手機版系列第 11 篇

技術 [Day 11] Grid 格線系統 Part 1

概述我們再重新複習一下， Grid for layout, Flex for component. 格線系統的發展從 2011 年開始，一直到 2016...

閃光洽 ‧ 2020-09-25

0 Like 1 留言 2453 瀏覽

鐵人賽 Modern Web DAY 3

我說那個手機版系列第 3 篇

技術 [Day 3] 我是誰，我在哪裡

回到未來網頁在很久很久以前，是使用 HTML 來製作的，約莫過了 20 幾個年頭，現在的網頁還是 HTML 製作的。只是版本號的推演進度比較慢，目前來到 HT...

閃光洽 ‧ 2020-09-17

2 Like 0 留言 2425 瀏覽

鐵人賽自我挑戰組

破釜沉舟的轉職路-37歲從0開始成為一個軟體工程師系列第 31 篇

技術關於購物車頁面的 RWD 移動概念

鐵人賽結束了，但說過了寫文章是 to be continued 的，今天就要先來記錄一下這個購物車頁面的 RWD 移動概念。回歸正常學習進度，檢視了一下作業與...

Alec ‧ 2019-10-18

0 Like 0 留言 2422 瀏覽

鐵人賽 Modern Web DAY 12

我說那個手機版系列第 12 篇

技術 [Day 12] Grid 格線系統 Part 2

容器我們先來看 Grid 的容器，他包含了一張試算表　像是 Table 一樣的東西，為何會說他像是 Table，我直接舉例給大家看就知道了， .grid...

閃光洽 ‧ 2020-09-26

3 Like 0 留言 2351 瀏覽

鐵人賽 Modern Web DAY 2

我說那個手機版系列第 2 篇

技術 [Day 2] 那個網頁設計

網頁有什麼粗略上來看，目前市面上瀏覽器打開的那個「畫面」，就屬於我們俗稱的「網頁」或是「網站」。而且不難發現每次去到各種網站，最常見的大概就是廣告。上方廣告橫...

閃光洽 ‧ 2020-09-16

0 Like 0 留言 2232 瀏覽

鐵人賽 Modern Web DAY 16

用Angular打造完整後台系列第 16 篇

技術 day16 List常見問題(一)

簡述列表中經常會遇到的問題大約幾下幾種：當後台需要RWD，但欄位太多了，縮起來實在是太難看。使用materia提供的MatPaginatorMod...

Yating Chang ‧ 2019-10-01

1 Like 0 留言 2232 瀏覽

鐵人賽 Modern Web DAY 3

AMP 系列第 3 篇

技術 AMP(Lession 3) - 使用AMP做RWD

使用AMP做RWD RWD 在現如今的網站，可以說是必備設定了。這兒要注意一點：平日裡我們是用 css 在做 RWD 的設定，但在 AMP 的世界裡，並不是這樣...

majo2013 ‧ 2018-10-03

0 Like 0 留言 2186 瀏覽

技術使用更親民！財政部中區國稅局網站全面採用「響應式」網頁設計

政府與公家機關的網站能提供民眾許多便民資訊，因此時常被使用，但因應現在多數人都習慣直接使用行動裝置閱覽，這時便容易出現問題：不適應手機規格的網頁常常需要民眾自行...

meimel ‧ 2019-02-18

0 Like 0 留言 2096 瀏覽

鐵人賽自我挑戰組 DAY 8

【Tailwind】你聽過尾巴風嗎 ? CSS 框架 tailwind 的新手入門指南系列第 8 篇

技術 Day 8：一切準備就緒，Tailwind我來了！【Tailwind – 容器與RWD篇】

在開發時，"容器"不可或缺且面對響應式設計 (RWD) 更需要有容器的概念才適合做出自適應的網頁，現在就讓我們來看看容器與 RWD 是如何在...

linlaose ‧ 2022-09-23 ‧團隊死線衝鋒 Deadline Squad

1 Like 1 留言 1991 瀏覽

技術【前端自學之路】如何開始?

大家好!我是Steven，現在是一位下班時用閒暇時間自學前端技術的上班族，今天想分享一些我在學習過程中所領悟到的事，並且分享給你們，首先今天想聊聊如何開啟前端自...

steven841221 ‧ 2020-04-06

0 Like 0 留言 1936 瀏覽

鐵人賽 Modern Web DAY 16

從零開始學 - Side Project專題開發及切版實作技巧系列第 16 篇

技術 Day 16 - 切版進階技巧(二) : 版型規劃、RWD規劃

Day 16 - 切版進階技巧(二) : RWD、版型規劃每日一談嗨，大家好 ! 我是阿蘇今天是Day16 ，今天分享的是RWD、版型規劃，目前大部分的網...

阿蘇蘇 ‧ 2022-10-01 ‧團隊死線衝鋒 Deadline Squad

0 Like 1 留言 1869 瀏覽

鐵人賽 Modern Web DAY 7

我說那個手機版系列第 7 篇

技術 [Day 7] Flexbox 的使用姿勢 Part 1

簡單介紹雖然說 Flexbox 已經推出好一段時間了，但說實在話我自己好像沒有特別著墨。當然，我覺得如果可以的話，去看一下 Amos 的課程，一定比看我在這邊...

閃光洽 ‧ 2020-09-21

0 Like 0 留言 1845 瀏覽

鐵人賽 Modern Web DAY 8

我說那個手機版系列第 8 篇

技術 [Day 8] Flexbox 的使用姿勢 Part 2

流當我們定義好一個 flex 的容器時，昨天有說過了，預設會使用 row 這個設定來定義容器的流向。所以，在容器定義好的當下，我們把基本的容器設定展開來看，另...

閃光洽 ‧ 2020-09-22

0 Like 1 留言 1829 瀏覽

鐵人賽 Modern Web DAY 2

Super Easy CSS，極度簡單：寫出好的 CSS，從零開始前端生涯系列第 2 篇

技術 #01 網頁的基本名詞：UI/UX？切版&切圖？前端&後端？靜態&動態？RWD or Mobile First？

↓ 今日學習重點 ↓ 理解網頁設計師、工程師常用的詞彙是什麼？網頁的基本名詞 UI/UX？ UI/UX 分別代表使用者介面設計（User Inte...

Eva Chen ‧ 2023-09-17

0 Like 0 留言 1827 瀏覽

鐵人賽 Modern Web DAY 7

Follow me! 來一場前端技能樹之旅系列第 7 篇

技術 [Day 07 - RWD] 跨平台生存之道 — RWD響應式網頁設計

現在越來越多種類的裝置出現，包括電腦、平板、手機，我們會在不同大小的螢幕上瀏覽網頁，究竟網頁要如何在所有設備上，都能顯示適合該裝置的排版模式？在過去會根據裝置來...

May ‧ 2021-09-20

0 Like 0 留言 1700 瀏覽

鐵人賽 Modern Web DAY 22

【每天5分鐘】學前端系列第 22 篇

技術 Day22【每天5分鐘】學前端 | CSS RWD 響應式網頁設計

什麼是 RWD ？有發現同一個網站，在使用電腦、平板和手機瀏覽時，視覺上排版方式不太一樣嗎？這個就是 RWD（響應式網頁設計）。以下引用自...

Olivia ‧ 2022-09-23

0 Like 0 留言 1646 瀏覽

技術我的第一個RWD網頁

開始之前先送上菜雞的code 這是我第一次實作ＲＷＤ的網頁，又因為最近同步在看Bootstrap。所以起初覺得很簡單，畢竟Bootstrap打一下md或lg，好...

leepiny ‧ 2020-11-08

0 Like 0 留言 1506 瀏覽

鐵人賽 Modern Web DAY 4

我說那個手機版系列第 4 篇

技術 [Day 4] 給我一個 Box

區塊我們在開天闢地的時候，網頁就是從區塊開始。 <header>  </header> <...

閃光洽 ‧ 2020-09-18

0 Like 0 留言 1505 瀏覽

技術我遇到的RWD網頁難題

上次文章終於迎來續集我的第一個RWD網頁這次的網頁練習跟上次的網頁是同系列的，不過這次可是有記起上次的教訓。也第一次使用了SCSS和GitHub。（這部分之...

leepiny ‧ 2020-11-21

0 Like 0 留言 1483 瀏覽

技術菜雞SCSS初體驗

還記得前兩週我都在學習如何手刻RWD網頁，不只有許多的HTML結構要去注意。就連CSS樣式也希望能使用模組化的方式建構。總之，就是要讓code不要太冗長不好管理...

leepiny ‧ 2020-11-29

0 Like 0 留言 1466 瀏覽

鐵人賽 Modern Web DAY 6

我說那個手機版系列第 6 篇

技術 [Day 6] 從響應式的那個東西說起

很久很久以前想當年 Photoshop 可以把圖片輸出成網頁用的東西的時候，你會發現有兩種模式， <table> <tr>...

閃光洽 ‧ 2020-09-20

0 Like 0 留言 1333 瀏覽

鐵人賽 Modern Web DAY 26

我說那個手機版系列第 26 篇

技術 [Day 26] RWD 的難題 Part 3

從手機版到桌機版講完一些基礎的 Media Query 之後，我們來看看全部都放在一起的一些情況。單就我們前幾天提到的狀況，在那個 .sidebar 屬於...

閃光洽 ‧ 2020-10-10

0 Like 0 留言 1317 瀏覽