iT邦幫忙

切版相關文章
共有 72 則文章
鐵人賽 IT 管理 DAY 13

技術 [Day13-開發前期] 跟著 UI SPEC,切版不迷路🕵️

有系統的交付 UI 設計 在設計師們 UI 時,我們能夠隨時、直接的在 Figma 上看到,UI 的各種 width、padding 數值。雖然自動產生的方便歸...

鐵人賽 Modern Web DAY 19

技術 Day19 跑版&切好寫好

什麼是跑版?跑版,簡單來說,畫面不是你預期,東西待在它不該待的地方,畫面不忍直視,有興趣可自行查詢關鍵字。事情是這樣得,隨著每次Code Review做調整後,...

鐵人賽 Modern Web DAY 18

技術 Day18 切切切,如何解構元件(Component)?

我們要來談談切分元件了,我學習切分元件的概念,是到用SASS才出現Component這個詞,但其實在簡單切版的時候就會有初步概念了。記得那時候,跑去問問題,學姊...

鐵人賽 Modern Web DAY 3

技術 Day03 學習看文件W3C,武林秘笈之文件意識

看不懂啊 起初,跑去問問題,得到一則W3C官方規範網址,我試圖集中注意力,想要看透它,每個單字都懂意思,合在一起就看不懂了。是天書無誤,心想,規範有夠難看懂,...

鐵人賽 Modern Web DAY 2

技術 Day02 腦容量爆炸!打造你的切版工具箱

初入CSS,會被他豐富的屬性嚇到以為要玩記憶力大考驗,我曾經就把MDN的側欄屬性給他一個個看過(佩服自己的刻苦耐勞),後來隔天就忘了。經過幾番無功、探索與混亂...

鐵人賽 Modern Web DAY 1

技術 Day01 系列介紹 切版與CSS:打造工具箱與切版施工流程

切版與CSS:打造工具箱與切版施工流程! 轉往前端的第一大關便是切版,這工藝主要由HTML5、CSS3作為底層技術,搭配切版心法,並在各家瀏覽器上呈現畫面,切版...

技術 六角學院程式體驗營錯題筆記-切版

其實體驗營已經結束一陣子了 最近才有空回來補齊每日作業,這邊寫的感覺都算是很基礎的東西,就給像我一樣的純新手看看,有興趣想報名六角的體驗營可以參考(對新手來說...

鐵人賽 Modern Web DAY 28

技術 Day 28 - 專案開發技巧篇(六) : 推薦實用套件

專案開發技巧篇(六) : 推薦實用套件 每日一談 嗨,大家好 ! 我是阿蘇今天是Day28 ,今天分享的是實用套件分享,我們可以在網路找到很多好用的套件,有很...

鐵人賽 Modern Web DAY 27

技術 Day 27 - 專案開發技巧篇(五) : Bootstrap 元件客製化

專案開發技巧篇(五) : Bootstrap 元件客製化 每日一談 嗨,大家好 ! 我是阿蘇今天是Day27 ,今天分享的是 Bootstrap 元件客製化教...

鐵人賽 Modern Web DAY 26

技術 Day 26 - 專案開發技巧篇(四) : Bootstrap 元件

專案開發技巧篇(四) : Bootstrap 元件 每日一談 嗨,大家好 ! 我是阿蘇今天是Day26 , 剩下最後倒數幾天,快要完結篇啦 !!今天分享的是...

鐵人賽 Modern Web DAY 25

技術 Day 25- 專案開發技巧篇(三) : Variable、Utilities

專案開發技巧篇(三) : Variable、Utilities 每日一談 嗨,大家好 ! 我是阿蘇今天是Day25 ,在這篇會詳細說明 Variable、Ut...

鐵人賽 Modern Web DAY 24

技術 Day 24 - 專案開發技巧篇(二) : Bootstrap 開發響應式網頁

專案開發技巧篇(二) : Bootstrap 開發響應式網頁 每日一談 嗨,大家好 ! 我是阿蘇今天是Day24 ,今天分享的是 以 Boostrap 為核...

鐵人賽 Modern Web DAY 22

技術 Day 22- 開發環境架設(三) : Bootstrap 自訂基礎樣式

開發環境架設(三) : Bootstrap 自訂基礎樣式 每日一談 嗨,大家好 ! 我是阿蘇今天是day22 ,今天分享開發環境架設 第三篇,我們來教大家如何...

鐵人賽 Modern Web DAY 21

技術 Day 21 - 開發環境架設(二) : ejs版型管理、layout

開發環境架設(二) : ejs版型管理、layout 每日一談 嗨,大家好 ! 我是阿蘇今天是Day21 ,今天分享開發環境架設 第二篇,我們來分享架設時使用...

鐵人賽 Modern Web DAY 29
【每天5分鐘】學前端 系列 第 29

技術 Day29【每天5分鐘】學前端 | 切版實作 CSS 篇

昨天架構完 HTML (附上連結 切版實作 HTML 篇),今天要加上 CSS 樣式做排版~ 會補充說明 偽類別 ,以及 CSS 變數 的使用方法。 首先建立一...

鐵人賽 Modern Web DAY 20

技術 Day 20 - 開發環境架設(一) : Bootstrap 核心、SCSS架構

開發環境架設(一) : Bootstrap 核心、SCSS架構 每日一談 嗨,大家好 ! 我是阿蘇到了第20天啦 ,剩下的天數都會來分享關於正式開發 Side...

鐵人賽 Modern Web DAY 28
【每天5分鐘】學前端 系列 第 28

技術 Day28【每天5分鐘】學前端 | 切版實作 HTML 篇

鐵人賽將近尾聲了~時間在不知不覺間也過得很快。 我們來切一個簡單的網頁吧! Wireframe 配置 方框中間有叉叉 : 表示 圖片 方框 : 表示...

鐵人賽 Modern Web DAY 18

技術 Day 18 - 開發小知識(二) : 切版學習之路、實作精進切版

Day 18 - 開發小知識(二) : 切版學習之路、實作精進切版 每日一談 嗨,大家好 ! 我是阿蘇今天是 Day17 , 前面的切版實作技巧分享差不多了,...

鐵人賽 Modern Web DAY 15

技術 Day 15 - 切版進階技巧(一) : CSS進階、CSS動畫、偽元素

Day 15 - 切版進階技巧(一) : CSS進階、CSS動畫、偽元素 每日一談 嗨,大家好 ! 我是阿蘇今天是Day15 , 不知不覺寫到了15天,不曉得...

鐵人賽 Modern Web DAY 14

技術 Day14 - 切版排版技巧(二) : Width、格線系統(Bs)

Day 14 - 切版排版技巧(二) : Width、格線系統(Bs) 每日一談 嗨,大家好 ! 我是阿蘇今天是Day14, 今天繼續談切版排版技巧,除了fl...

鐵人賽 Modern Web DAY 13

技術 Day 13 - 切版排版技巧(一) : Flex排版、Box模型

Day 13 - 切版排版技巧(一) : Flex排版、Box模型 每日一談 嗨,大家好 ! 我是阿蘇今天是Day13 ,我們前面分享了HTML / CSS...

鐵人賽 Modern Web DAY 12

技術 Day 12 - 切版基礎打底(二) : 必學CSS運用

Day 12 - 切版基礎打底(二) : 必學CSS運用 每日一談 嗨,大家好 ! 我是阿蘇今天是Day12,我們一樣繼續談談CSS的實作運用,有哪些是必學、...

鐵人賽 Modern Web DAY 30

技術 【設計+切版30天實作】|Day30 - 最後一天了嗚嗚嗚的30天參賽心得

感人時刻 今天是鐵人賽30天的最後一天了,有種「嗯?30天了喔?」的奇妙感覺!畢竟已經習慣每天上來發文,也習慣隊友們每天互相提(恐)醒(嚇)發文!!! 突然有點...

鐵人賽 Modern Web DAY 26

技術 【設計+切版30天實作】|Day26 - Reviews區塊 - 卡片可以因應不同用途而千變萬化

前面完成了「Carousel」區塊,今天來完成「Reviews」的區塊。 數據收集 card 標題的樣式 Font-weight:Regular F...

鐵人賽 Modern Web DAY 24

技術 【設計+切版30天實作】|Day24 - Steps區塊 - 如何做出漸層背景?

前面完成了「Pros」區塊,今天來完成「Steps」的區塊。 數據收集 標題的樣式 Font-weight:Medium Font-size:24p...

鐵人賽 Modern Web DAY 23

技術 【設計+切版30天實作】|Day23 - Pros區塊 - 看似無邊框的三欄式卡片,到底要對準哪條欄位?

前面完成了小廣告區塊,今天來完成「平台好處 - pros」的區塊。 數據收集 card標題的樣式 Font-weight:Bold Font-siz...