vue3中css使用script中定义的变量

代码

javascript 复制代码
<template>
  <div class="box">haha</div>
</template>

<script setup lang="ts">
const boxWidth = '500px'
</script>

<style lang="scss">
.box {
  width: v-bind(boxWidth);
  height: 200px;
  background-color: red;
}
</style>

效果

相关推荐
希冀1231 小时前
【CSS学习第八篇】
css·学习·tensorflow
用户059540174462 小时前
用LangChain+Chroma实现RAG多轮对话记忆与自动化测试,把bug发现时间从2小时压缩到5分钟
前端·css
用户059540174462 小时前
我把RAG对话记忆测试从手工用例改成ChromaDB自动化评估,Bug发现率翻了4倍
前端·css
码农君莫笑21 小时前
深入理解 CSS Grid 布局:从入门到实战
前端·css
用户059540174461 天前
把Agent记忆测试从Mock换到真实Redis,漏测率从30%降到0
前端·css
LIUAWEIO2 天前
CSS 让鼠标呈现手型,鼠标悬浮变小手
css·html·css3·html5
ZC跨境爬虫2 天前
跟着 MDN 学CSS day_51:支持旧浏览器的布局策略
前端·css·html·tensorflow·媒体
Larcher2 天前
从 0 到 1:Node.js 调用 AI API 的完整避坑指南
前端·javascript·css
八目蛛2 天前
八目蛛网络(免费工具网站导航)
css·vue.js·开源·vue3·html5·ai编程
xiangxiongfly9152 天前
CSS @layer总结
css·layer