iT邦幫忙

sass相關文章
共有 198 則文章
鐵人賽 自我挑戰組 DAY 20
CSS甜點烘焙店 系列 第 20

技術 新鮮出爐的甜點來囉~利用scale()快速將【櫥窗佈置】到位

您好,歡迎光臨CSS甜點烘焙店 第2-15天畫的甜點們,終於要把它們擺上架了不過一次放進來的架構有點龐大,以下就以品項帶過,最後完成會釋出codepen讓大家參...

鐵人賽 自我挑戰組 DAY 2
CSS甜點烘焙店 系列 第 2

技術 【巧克力切片蛋糕】簡單好用的clip-path,直接畫出你想要的形狀

您好,歡迎光臨CSS甜點烘焙店 今天上架的是巧克力切片蛋糕 蛋糕主要分成3個部份,上層巧克力、下層蛋糕體,以及巧克力上方的奶油Html結構如下: .chocol...

鐵人賽 自我挑戰組 DAY 19
CSS甜點烘焙店 系列 第 19

技術 店面的靈魂之【窗】,框、板、反光,2層搞定!

您好,歡迎光臨CSS甜點烘焙店 今天體力恢復的還不錯,除了還是有劇咳,沒力氣吼小孩之外,其它還算安好 我們就來開始店面的展示櫥窗吧~ Html部份,繼續在.al...

鐵人賽 自我挑戰組 DAY 6
CSS甜點烘焙店 系列 第 6

技術 【千層年輪蛋糕】哇嗚,原來box-shadow還可以這樣用~

您好,歡迎光臨CSS甜點烘焙店 今天上架的是千層年輪蛋糕 蛋糕主要分成3個部份,上層年輪、中間空洞,以及蛋糕表皮Html結構如下: .baumkuchen ....

鐵人賽 自我挑戰組 DAY 9
CSS甜點烘焙店 系列 第 9

技術 【馬卡龍】什麼!3層架構就做出馬卡龍,還有flex排的簡單九宮格喔

您好,歡迎光臨CSS甜點烘焙店 今天上架的是馬卡龍 馬卡龍主要分成3個部份,上層外殼、下層外殼,以及中層夾餡Html結構如下: .macaron .to...

鐵人賽 自我挑戰組 DAY 15
CSS甜點烘焙店 系列 第 15

技術 【珍珠鮮奶茶】不可不知的perspective透視技巧,畫完好想喝一口

您好,歡迎光臨CSS甜點烘焙店 今天上架的是珍珠鮮奶茶 珍珠鮮奶茶主要分成杯子、圓形標籤、珍珠及吸管Html結構如下: .bubbleTea .cup ....

鐵人賽 自我挑戰組 DAY 13
CSS甜點烘焙店 系列 第 13

技術 【草莓塔】你知道background就可以做塔杯嗎?

您好,歡迎光臨CSS甜點烘焙店 今天上架的是草莓塔 餅乾主要分成3個部份,塔、乳酪餡及草莓Html結構如下: .cream .main .berry...

技術 Sass 基礎教學 DAY31

Sass 我們應該大部分的人都有聽過那它到底是什麼東西呢??我們先來介紹它到底是啥 維基百科https://zh.wikipedia.org/wiki/Sass...

鐵人賽 自我挑戰組 DAY 25
CSS甜點烘焙店 系列 第 25

技術 box-shadow用途廣,【雲朵】繪製多變化

您好,歡迎光臨CSS甜點烘焙店 今天我們來加上幾朵飄飄雲 Html架構如下 .all .sky .cloud.left .cloud.right...

鐵人賽 自我挑戰組 DAY 21
CSS甜點烘焙店 系列 第 21

技術 是時候該擺一攤珍珠奶茶了,box-shadow用好用滿、簡單複製物件

您好,歡迎光臨CSS甜點烘焙店 店面在昨天已經大致完成,旁邊不如再來一個飲料攤位吧~ Html如下 .beverageStore .mid Bubble Te...

鐵人賽 自我挑戰組 DAY 11
CSS甜點烘焙店 系列 第 11

技術 【草莓餡愛心餅乾】一次就上手的愛心,其實很簡單喔~

您好,歡迎光臨CSS甜點烘焙店 今天上架的是草莓餡愛心餅乾 餅乾主要分成3個部份,餅乾體、愛心果醬及果醬厚度Html結構如下: .cookie .mai...

鐵人賽 自我挑戰組 DAY 4
CSS甜點烘焙店 系列 第 4

技術 【銅鑼燒】多啦A夢最愛的甜點,只用了3層架構就做完

您好,歡迎光臨CSS甜點烘焙店 今天上架的是銅鑼燒 銅鑼燒主要分成3個部份,上層麵皮、中層紅豆餡、下層麵皮,看似這麼多層的層次,其實只要2層架構就可以完成喔~不...

鐵人賽 自我挑戰組 DAY 5
CSS甜點烘焙店 系列 第 5

技術 【草莓奶油小蛋糕】不得不說box-shadow真的好用無極限

您好,歡迎光臨CSS甜點烘焙店 今天上架的是草莓奶油小蛋糕 蛋糕主要分成3個部份,上層草莓、中層蛋糕體,以及下層餅乾Html結構如下: .strawberryC...

鐵人賽 自我挑戰組 DAY 26
CSS甜點烘焙店 系列 第 26

技術 喵喵~鎮店【店貓】來了

您好,歡迎光臨CSS甜點烘焙店 今天邀請了一位貓咪,來當鎮店店貓 Html架構如下 .cat .ear .eye .mouth .body .tail...

鐵人賽 自我挑戰組 DAY 10
CSS甜點烘焙店 系列 第 10

技術 【焦糖布丁】這不是兔子耳朵啦~流動糖漿的眉眉角角

您好,歡迎光臨CSS甜點烘焙店 今天上架的是焦糖布丁 焦糖布丁分成以下幾個架構,頂層光暈、中層糖漿、布丁、下層糖漿,以及盤子Html結構如下: .pudding...

鐵人賽 自我挑戰組 DAY 17
CSS甜點烘焙店 系列 第 17

技術 可以遮風擋雨囉~【屋頂招牌及遮陽棚】,善用background來複製圓形

您好,歡迎光臨CSS甜點烘焙店 今天要施作屋頂招牌及遮陽棚的部份 續上一集的架構再往下新增 .all .store .awning .s...

鐵人賽 自我挑戰組 DAY 12
CSS甜點烘焙店 系列 第 12

技術 【雙莓閃電泡芙】如何用2個圓做出藍莓?

您好,歡迎光臨CSS甜點烘焙店 今天上架的是雙莓閃電泡芙 這次的元素比較複雜,架構也相對多一些,Html結構如下: .eclair .main/*泡芙*/...

鐵人賽 Modern Web DAY 24

技術 Day24 預處理器 SASS,我們是朋友嗎?

初次接觸 SASS(Syntactically Awesome Style Sheets)時,可能只有一頁設計稿,並且沒有特別感受到它的威力。相反地,花了很多時...