這裡必須先介紹為什麼我們需要模組化呢?這裡舉一個例子我們尚未模組化的css //基本按鈕 .btn{ display: inline-block; wi...
今天要來介紹 Sass/Css 設計模式啦~~首先我們先認識 最好入門的 Smacss官網: http://smacss.com/ Smacss Base 首...
今天我們要來介紹Sass Mixin 與 content的搭配 來解決RWD Scss: @mixin pad{ @media(max-width: 7...
今天要來介紹 Sass Mixin那究竟什麼是 Mixin呢??簡單來說Mixin能幫你記住 css技巧讓你不用再因回想原理而去google(把它想像成一個包裝...
今天我們要來學習如何把Sass切分支許多檔案這樣會使我們比較容易管理 @import(匯入)可將 Scss檔案彙整成一支 css檔案簡單來說就是我們可以把 Sc...
今天我們要來介紹 Sass的變數啦~~介紹之前我們必須先了解為什麼我們需要它呢??當我們原先在撰寫 css的時候假設有100個地方的顏色皆為紅色但有一天我們需要...
在介紹今天的內容之前推薦一個不錯的東西那就是 CodePen啦https://codepen.io/your-work可以先上撰寫程式碼連 Sass也支援 非常...
Sass 我們應該大部分的人都有聽過那它到底是什麼東西呢??我們先來介紹它到底是啥 維基百科https://zh.wikipedia.org/wiki/Sass...
第一次參加鐵人賽非常的開心又緊張啊(害怕自己寫錯哈哈)不過總覺得每日發文會上癮雖然可能沒人會看但重點在於 自己 是否有成長只要有 那就值得啦~~~ 雖然30天說...
都已經千辛萬苦的學會CSS了，不用用這個技能不是就太浪費了嗎? 對，本篇文就是要來看看怎麼在低代碼平台上用CSS。 工具 好用的IDE (我用Visual S...
好的~上一篇已經學會了 Sass 基本的語法應用，這篇來介紹 Sass 的進階語法，讓你會一度有 CSS 是程式語言的錯覺。 先記住這兩個語法 定義變數va...
我假設你已經會... 使用 CSS 定義樣式（選用適當的選擇器定義屬性與屬性值） 已配置 Sass 編譯 CSS 的開發環境（若還沒，使用線上編輯器 Cod...
本系列文以製作專案為主軸，紀錄小弟學習React以及GrahQL的過程。主要是記下重點步驟以及我覺得需要記憶的部分，有覺得不明確的地方還請留言多多指教。 雖...
話不多說,先上成果! 思考迴路: 撰寫keyframes使每個點上下移動(transform),我們命名這個keyframe為waving 每個點都具備相同...
Sass/Scss是一個非常好用的預處理器，所謂預處理器，就是可以在我們轉變成CSS之前，更有結構性寫、簡潔、清晰且好維護的 CSS 程式碼，在大型專案中可說是...
**我們需要您具備以下能力： 1、從事前端開發2年及以上，熟悉各種前端技術，包括HTML/CSS/JavaScript/Node.JS等2、具備跨終端的前端開發...
接續上篇繼續介紹剩下的功能，這邊就比較偏程式面，設計函式會比較常使用到，GO!GO!GO! 迴圈部分 迴圈可使用 @each 與 @for 來產生重複的樣式，使...
之前介紹過 SCSS 的基礎功能了，沒看過可以看這裡唷，這次來介紹一些小知識與進階的功能吧! SCSS 小知識 註解 SCSS 的註解有分為兩種，一種會被輸出一...
SASS / SCSS 簡介 SASS 是 CSS 的預處理器，它能編譯出原生 CSS，且提供了更多程式面的東西來撰寫 CSS，讓其更簡潔、更好維護，而 SAS...
Variable$variablename: valuedefine all global variables in "_globals.sass...
分享與記錄個人使用 scss 時的那些 wow 點 在前端學習進度上，目前走到了 Javascipt，幾週前開啓 scss 時，感到有點陌生啊~~ 人的記憶不可...
良好程式碼的優點大同小異。不好的程式碼的糙點卻各有巧妙之處。 此篇的 coding 建議，不適用於 C 前置處理器 C 語言做到 template 或 g...
CSS 它有先後順序，後面會蓋掉前面！ <link rel="stylesheet" href="style/style1....
先來看看這張圖 各位看出什麼了嗎？ CSS 大部份人都不陌生，如果是有在摸索網頁或有在寫BLOG的朋友們，多多少少已經碰過啦 SASS & SCSS...
VSCode 吸引人的原因除了本身內建的功能相當多，VSCode 能夠安裝的插件也是又多又好用又方便呀～使用插件可以更有品質或是更快速的進行開發，前一篇為大家介...
專案使用 SCSS 寫法，我們之前用 Gulp 來 Compile，也使用過 ASP.NET MVC Web Compiler 來處理，後者的缺點是必須使用 V...
今天我們將改變 CSS 引用方式，改為使用 SASS 開發，管理我們的 CSS，因此 style tag 也可以寫 SCSS 囉！ 今天目標： 移除從 st...
Sass 的 @extend 可以將相同的樣式整理再一起，在其他語言來說是非常帥氣的技法，但在 CSS 中請警慎使用。 就如同本篇鐵人賽一開始所介紹到的 OOC...
上一篇介紹了很短的程式碼產生一整組 Grid System，然後還提供變數讓 Grid 還有額外的參數可以設定，手寫的 CSS 如果要重新計算 12 組以上的計...
自己本身是不常自幹 Grid，但透過自幹會了解更細的運作原理，grid system 和其他元件不太一樣，他是屬於外容器型的元件，一層包覆著一層變化性相當高，如...
皮傑先生
Mel
Eudora
Jasper
Lai
Chris
凱特麻麻桑
六角學院
TYSON
Jacky
卡斯伯
iThome鐵人賽
看影片追技術