iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 28
0

抱歉今天比較忙,內容可能會比較少,敬請見諒

自訂顏色

設定元件顏色color時我們都會去找 Color Palette 看看有沒有喜歡的顏色,在複製來用。

那萬一我今天有自己喜歡的顏色,但調色盤沒有,直接填色碼進去又會沒出來QQ

這邊就教大家怎樣新增新的顏色吧

打開 src/css/app.styl

這邊就是給我們自訂全域CSS的地方啦

看到副檔名是.styl不是.css就知道這裡不單純啦

這邊是用 Stylus 寫的

不過不用擔心,就把它當成是簡化版的CSS吧

新增顏色

假設我們今天要增加一個紅色#D03F38,變數叫做 redsp 好了

.text-redsp
  color #D03F38
.bg-redsp
  background #D03F38

把這四行加進app.styl裡面

記得textbg都要有喔 不然會出不來

使用

<q-btn color="redsp">Open</q-btn>

這樣就出來囉
https://ithelp.ithome.com.tw/upload/images/20181111/20111805AuEhKnYJdZ.png

今天先這樣....


上一篇
[Day 27] Vue Quasar 來談談 CSS Helpers
下一篇
[Day 29] Vue Quasar 多國語系 I18n
系列文
[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言