颜色模式图片
一个在亮色和暗色模式下具有不同图片源的图像元素。
用法
ColorModeImage 组件在安装了 <NuxtImg> 组件时使用它，@nuxt/image否则回退到使用 img。
<template>
<UColorModeImage
light="https://picsum.photos/id/29/400"
dark="https://picsum.photos/id/46/400"
:width="200"
:height="200"
/>
</template>
在浅色和深色模式之间切换以查看不同的图片
API
属性
| 属性 | 默认值 | 类型 |
|---|---|---|
深色 | string | |
浅色 | string | |
alt | string | |
crossorigin | "" | "anonymous" | "use-credentials" | |
decoding | "async" | "auto" | "sync" | |
height | string | number | |
loading | "lazy" | "eager" | |
referrerpolicy | "" | "no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" | |
sizes | string | |
srcset | string | |
usemap | string | |
width | string | number |