在Vue中,可以使用import
語句引入CSS文件,在組件的script
標(biāo)簽中,使用import
語句引入CSS文件,要引入一個名為style.css
的CSS文件,可以這樣做:
import './style.css';
或者,如果CSS文件位于組件的assets
目錄下,可以這樣做:
import 'assets/style.css';
引入CSS文件后,可以在組件的template
標(biāo)簽中使用v-bind
指令將樣式綁定到組件的根元素上。
<template> <div v-bind:style="styleObject"> <!-- 組件內(nèi)容 --> </div> </template>
styleObject
是一個包含樣式的JavaScript對象,可以根據(jù)需要設(shè)置樣式的屬性,
data() { return { styleObject: { color: 'red', fontSize: '16px' } } }
這樣,組件的根元素就會應(yīng)用上指定的樣式,注意,如果引入了多個CSS文件,需要分別綁定每個文件的樣式。
版權(quán)聲明:除非特別標(biāo)注,否則均為本站原創(chuàng)文章,轉(zhuǎn)載時請以鏈接形式注明文章出處。