您好,歡迎光臨CSS甜點烘焙店
是的!就在昨日我確診了,自己發燒、喉嚨痛、全身酸痛之外,還要顧2隻小屁孩外加打理3餐,只能找空檔來完成文章,還好前幾日就有預先畫了一點進度,加加減減補齊,我想這次真的是很難得的經驗,目標只有完成30天就偷笑了
今天就讓我鬆懈一點,畫個可愛的馬卡龍小招牌就好吧~
.signboardRight
.macaron
.top
.cream
.bottom
畫一小圓形,並給線性漸層
width: 1.8rem
height: 1.6rem
border-radius: 50%
background: linear-gradient(130deg, rgba(161,99,15,1) 10%, rgba(99,32,29,1) 50%)
讓我們利用box-shadow
加入厚度
box-shadow: 0.05rem 0.05rem 0 0.05rem #340907
接下來在&::before
畫一小小的長方形,銜接招牌與牆面
width: 0.2rem
height: 0.1rem
background: #4b120f
這裡拿先前做好的馬卡龍,當做招牌圖案,可以參考【馬卡龍】什麼!3層架構就做出馬卡龍,還有flex排的簡單九宮格喔
顏色換成適合招牌的淺咖啡色
.top
background: #ffe3d5
&::before
background: #d9a084
.cream
background: #543220
.bottom
background: #d9a084
&::before
background: #ffe3d5
店面馬卡龍招牌完成!
希望今天的打造店面您還滿意,請慢用~
如有任何問題,歡迎下方留言討論