VUE项目学习——stylus语言

流行的css预编译语言：less、sass、stylus
（可以理解成css的加强版，更方便，更简洁。无论是使用那种语言最后都会转换成css）

stylus的使用

1、先下载需要用的依赖包

npm install stylus stylus-loader

2、在需要使用的html中引入stylus

<style lang="stylus">
#appcontain
  .noshipei
    height 100px
    background red
</style>

3、stylus使用方法

a.省略花括号{} 冒号： 分号；
b.具有明显的层级关系，和dom结构一致
c.可以定义变量 $clolor = red
d.定义混合(minixs)，等同于之前的函数能够，能够复用代码
e.定义函数，可以用来做内部计算
f.父级引用 &==当前位置的父级元素

<style lang="stylus">
$color = blue
#appcontain
  .noshipei
    height 100px
    background red
  .shipei
    width 10rem
    height 100px
    background $color
</style>