Day 13 - 切版排版技巧(一) : Flex排版、Box模型 每日一談 嗨，大家好 ! 我是阿蘇今天是Day13 ，我們前面分享了HTML / CSS...
開發環境架設(二) : ejs版型管理、layout 每日一談 嗨，大家好 ! 我是阿蘇今天是Day21 ，今天分享開發環境架設 第二篇，我們來分享架設時使用...
專案開發技巧篇(六) : 推薦實用套件 每日一談 嗨，大家好 ! 我是阿蘇今天是Day28 ，今天分享的是實用套件分享，我們可以在網路找到很多好用的套件，有很...
專案開發技巧篇(五) : Bootstrap 元件客製化 每日一談 嗨，大家好 ! 我是阿蘇今天是Day27 ，今天分享的是 Bootstrap 元件客製化教...
前言 在開賽前，先來做個小小的自我介紹好了！目前是火箭隊的網頁設計組，加入火箭隊前有上過六角學院的UI課程（上課前完全是0基礎 ><!!!），但卻從...
大綱 前半段都在設計，今天開始就要進行切版了！(緊張!!!)那我們header的部分分成heroheader和navbar，今天的任務是切「Heroheader...
Day 15 - 切版進階技巧(一) : CSS進階、CSS動畫、偽元素 每日一談 嗨，大家好 ! 我是阿蘇今天是Day15 ， 不知不覺寫到了15天，不曉得...
前面完成了「Carousel」區塊，今天來完成「Reviews」的區塊。 數據收集 card 標題的樣式 Font-weight：Regular F...
大綱 前面已經把Landing Page的設計稿設計完成了，接下來要開始切版實作！但在切版前，我們需要把設計稿上的數據都先列出來，因為切版前要先做客製化的設定唷...
昨天架構完 HTML （附上連結 切版實作 HTML 篇），今天要加上 CSS 樣式做排版～ 會補充說明 偽類別 ，以及 CSS 變數 的使用方法。 首先建立一...
前面完成了「CTA」區塊，今天來完成「Footer」的區塊。 數據收集 Footer的樣式 Background-color：$Secondary...
設計大綱 原本想把Reviews做成一行六個、並且可以超出視窗，另外使用者可以用拖曳的方式去移動卡片。但看完Boostrap 5的官網，目前好像沒辦法切出超出視...
Day 18 - 開發小知識(二) : 切版學習之路、實作精進切版 每日一談 嗨，大家好 ! 我是阿蘇今天是 Day17 ， 前面的切版實作技巧分享差不多了，...
main.css #calender{ margin: 0 auto; width: 90%; } .day, .date-block{ f...
專案開發技巧篇(四) : Bootstrap 元件 每日一談 嗨，大家好 ! 我是阿蘇今天是Day26 ， 剩下最後倒數幾天，快要完結篇啦 !!今天分享的是...
設計大綱 Landing Page的主要色都偏深色，另外CTA也有用主要色作為背景顏色了，所以這邊的Footer就決定用淺色的Secondary-color來作...
設計大綱 在上一篇設計「Reviews」這個區塊時，有提到切版時可能會有「切不出來」的情況發生，所以只好把原本腦海裡想要的設計改成簡單兩行的卡片式去呈現。但是！...
前面完成了「Plans」區塊，今天來完成「CTA」的區塊。 數據收集 CTA的樣式 Background-color：$Primary Pad...
專案開發技巧篇(三) : Variable、Utilities 每日一談 嗨，大家好 ! 我是阿蘇今天是Day25 ，在這篇會詳細說明 Variable、Ut...
Day 14 - 切版排版技巧(二) : Width、格線系統(Bs) 每日一談 嗨，大家好 ! 我是阿蘇今天是Day14， 今天繼續談切版排版技巧，除了fl...
前面完成了「PainPoints」，今天來完成這一塊「小廣告」的區塊。 數據收集 Content標題的樣式 Font-weight：Bold Fon...
其實體驗營已經結束一陣子了 最近才有空回來補齊每日作業，這邊寫的感覺都算是很基礎的東西，就給像我一樣的純新手看看，有興趣想報名六角的體驗營可以參考(對新手來說...
前面完成了小廣告區塊，今天來完成「平台好處 - pros」的區塊。 數據收集 card標題的樣式 Font-weight：Bold Font-siz...
【主題一：Flexbox】單元： Flexbox基礎 彈性容器（flex container） 排列彈性項目 彈性內容 調整內容 對齊項目 align-sel...
前面完成了「Reviews」區塊，今天來完成「Plans」的區塊。 數據收集 標題的樣式 Font-weight：Bold Font-size：3...
前面完成了「Pros」區塊，今天來完成「Steps」的區塊。 數據收集 標題的樣式 Font-weight：Medium Font-size：24p...
專案開發技巧篇(二) : Bootstrap 開發響應式網頁 每日一談 嗨，大家好 ! 我是阿蘇今天是Day24 ，今天分享的是 以 Boostrap 為核...
設計大綱 早安！今天來設計痛點，這邊我想要做三欄式，列出三個他們目前主要可能會遇到的問題，再加上圖片，讓使用者有感到身受的感覺。另外，因為Grid system...
排列彈性項目 預設情況下，無論flex-flow設定了什麼樣的數值，彈性容器中最後一個彈性項目之後的空間，一定是在main-end與cross-end方向...
設計大綱 設計CTA的用意一方面是讓結尾不會來得太突然，另一方面是想在網頁的最後再來一個「Call To Action」。 由於上面已經有蠻多不同樣式的設計區塊...
阿蘇蘇
烙詩
Olivia
Amy
iThome鐵人賽
看影片追技術