當我們開發前端頁面時,CSS是必不可少的一部分。那么在Vue中,我們能否直接使用CSS呢?答案是肯定的。
在Vue中,我們可以使用普通的CSS文件或者直接使用內聯樣式來設置頁面樣式。為了在.vue文件中使用CSS,我們需要使用style標簽,并且需要添加scoped屬性,這樣CSS樣式才會局限于該組件中,而不會影響其他組件的樣式。下面是一個簡單的例子:
<template>
<div>
<p class="message">{{ message }}</p>
</div>
</template>
<script>
export default {
data() {
return {
message: 'Hello Vue!'
}
}
}
</script>
<style scoped>
.message {
color: blue;
}
</style>
在上述例子中,我們在