mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-22 05:35:13 +00:00
docs: reorder sfc blocks and add initial slash in link (#21618)
This commit is contained in:
parent
c9506cc3d5
commit
64bccf37a5
@ -313,14 +313,14 @@ You can reference JavaScript variable and expression within your style blocks wi
|
||||
The binding will be dynamic, meaning that if the variable value changes, the style will be updated.
|
||||
|
||||
```vue
|
||||
<template>
|
||||
<div class="text">hello</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const color = ref("red")
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="text">hello</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.text {
|
||||
color: v-bind(color);
|
||||
@ -333,15 +333,15 @@ const color = ref("red")
|
||||
The scoped attribute allows you to style component in insolation. The styles declared with this attribute will only apply to this component.
|
||||
|
||||
```vue
|
||||
<template>
|
||||
<div class="example">hi</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.example {
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
|
||||
<template>
|
||||
<div class="example">hi</div>
|
||||
</template>
|
||||
```
|
||||
|
||||
### CSS Modules
|
||||
@ -474,7 +474,7 @@ If you are using [UnoCSS](https://unocss.dev/integrations/nuxt), note that it co
|
||||
|
||||
### Transitions
|
||||
|
||||
Nuxt comes with the same `<Transition>` element that Vue has, and also has support for the experimental [View Transitions API](docs/getting-started/transitions#view-transitions-api-experimental).
|
||||
Nuxt comes with the same `<Transition>` element that Vue has, and also has support for the experimental [View Transitions API](/docs/getting-started/transitions#view-transitions-api-experimental).
|
||||
|
||||
::ReadMore{link="docs/features/transitions"}
|
||||
::
|
||||
|
Loading…
Reference in New Issue
Block a user