Stilius per style atributą Vue
CSS stilius galima tiesiogiai pridėti
per style atributą.
Tam į atributą perduodamas objektas, kuriame norimos
CSS savybės turi būti to objekto raktai,
o atitinkamos CSS savybių reikšmės -
to objekto reikšmės.
Pavyzdžiui, nuspalvinkime kokią nors pastraipą raudona spalva ir pridėkime žalios spalvos rėmelį:
<template>
<p :style="{color: 'red', border: '1px solid green'}">
text
</p>
</template>
Dabar vietoj rėmelio nustatykime jam
font-size į 30px. Kadangi
objekte negali būti raktų su brūkšneliu, mes
turime jį paimti į kabutes:
<template>
<p :style="{color: 'red', 'font-size': '30px'}">
text
</p>
</template>
Taip pat galima vietoj font-size parašyti
fontSize - tai taip pat veiks:
<template>
<p :style="{color: 'red', fontSize: '30px'}">
text
</p>
</template>
Duota pastraipa. Nuspalvinkite jos tekstą žalia spalva, o jos foną - geltona.
Duota pastraipa. Padarykite jos tekstą paryškintą ir kursyvinį.
