Vue—scoped样式

## scoped样式

1. 作用：让样式在局部生效，防止冲突。

2. 写法：```<style scoped>```

3. app组件中理论上不适用

Student.vue:

<template>
    <div class="demo">
        <h2 >学生名称：{{ name }}</h2>
        <h2>学生性别：{{sex}}</h2>
    </div>
</template>
<script>
    //import {hunhe} from '../mixin'
    export default {
        name:'s-student',
        data() {
            return {
                name:'Gui',
                sex:'female'
            }
        },
    }
</script>
<!--scope会随机给不同组件生成一个数字，进行区分-->
<!--style 可以写lang属性，来告诉编译器我们写样式的语言时是什么-->
<style scoped>
    .demo{
        background-color: rgb(135, 135, 40);
    }
</style>