Vue · Middle · Question 46 of 75

What does `v-bind()` inside `<style>` do?

<script setup>const color = ref("teal");</script>
<style scoped>p { color: v-bind(color); }</style>

✓Correct answer: Links a CSS value to reactive state through a CSS custom property
2Imports a stylesheet dynamically
3Binds a class name

Explanation

Vue sets a hashed CSS variable on the root element and updates it when color changes, so the styles stay in CSS.

Further reading

Vue API: SFC CSS Features ↗

Test yourself

Take the Vue · Middle quiz: questions and options are shuffled, and you get a review of your mistakes at the end.