1.建立tarbar
"tabBar": {
"color": "#333",
"selectedColor": "#74dbef",
"list": [
{
"text": "首页",
"pagePath": "pages/index/index",
"iconPath": "static/images/home.png",
"selectedIconPath": "static/images/home-h.png"
},
{
"text": "我的",
"pagePath": "pages/self/self",
"iconPath": "static/images/self.png",
"selectedIconPath": "static/images/self-h.png"
}
]
},
2.新建common的文件夹,在文件夹下面建立style文件夹,再在里面建立base-style.scss和common-style.scss
base-style
$brand-theme-color:#74dbef;
$brand-theme-color-aux:#576b95; //品牌辅助色
$page-bg-color:#F7F7F7; //页面背景色
$border-color:#e0e0e0; //边框颜色
$border-color-light:#efefef; //边框亮色
$text-font-color-1:#000; //文字主色
$text-font-color-2:#676767; //副标题颜色
$text-font-color-3:#a7a7a7; //浅色
$text-font-color-4:#b2b2b2; //更浅色
commom-style
view,text{
box-sizing: border-box;
}
page{
background: pink;
}
3.在uni.css和app.vue中分别引用上面俩个style文件//相对地址和绝对地址的写法
uni.css里面保存的是一些公有的属性,可以进行调用使用,而app.vue里面是直接对页面的属性的修改,一个是公有的变量,一个相当于页面的配置器
4.在index.vue中直接引用刚才的base-style中的属性,来修饰文本title
<style lang="scss">
.title {
color:$brand-theme-color;
}