在Vue中,給TD添加CSS樣式的方法有多種,我們可以在組件的style標(biāo)簽中直接定義CSS樣式,然后通過(guò)類(lèi)名或ID將樣式應(yīng)用到TD元素上。
```html
TD元素 |
```
在上面的代碼中,我們定義了一個(gè)名為"my-td"的類(lèi),并將它應(yīng)用到TD元素上,這樣,TD元素的文字顏色就會(huì)變?yōu)榧t色,字體大小也會(huì)變?yōu)?6像素。
我們也可以通過(guò)在JavaScript代碼中動(dòng)態(tài)綁定樣式的方式來(lái)給TD添加CSS樣式。
```javascript
export default {
data() {
return {
myStyle: {
color: 'red',
fontSize: '16px'
}
}
},
mounted() {
let td = this.$el.querySelector('td');
td.style.cssText = this.myStyle;
}
```
在上面的代碼中,我們首先在data函數(shù)中定義了一個(gè)名為"myStyle"的對(duì)象,該對(duì)象包含了要應(yīng)用到TD元素上的樣式,在mounted函數(shù)中,我們通過(guò)查詢選擇器獲取了TD元素,并將"myStyle"對(duì)象中的樣式綁定到TD元素的style屬性上,這樣,TD元素的樣式就會(huì)變?yōu)槲覀兌x的樣式。