技术栈

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

梁云亮2023-09-12 13:18

代码

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>

效果

上一篇:YOLO目标检测——密集人群人头数据集+已标注yolo格式标签下载分享
下一篇:审计智能合约的成本是多少?如何审计智能合约?
相关推荐
其实防守也摸鱼
7 小时前
Sqlmap:选取sqli-labs中less-8进行sqlmap注入测试
前端·css·网络·安全·web安全·less·sqli-labs
星恒随风
11 小时前
四天学完前端基础三件套(CSS篇)
前端·css·笔记·学习
bbq粉刷匠
12 小时前
了解HTML、CSS与JavaScript
javascript·css·html
阳火锅
1 天前
💡 告别类名地狱!Tailwind CSS 语义化转换神器来了
前端·css·vue.js
DFT计算杂谈
1 天前
AMSET 设置多核并行计算
java·前端·css·html·css3
前端老石人
1 天前
CSS 值定义语法
前端·css
JYeontu
1 天前
正方体翻滚Loading 2.0
前端·javascript·css
唐青枫
1 天前
别再手写重复 CSS 了:SCSS 从入门到实战
前端·css·scss
huohaiyu
1 天前
HTML和CSS基础使用
前端·css·html
热门推荐
01GitHub 镜像站点02Codex 接入 DeepSeek API 完整配置文档03CC-Switch & Claude 基于 Linux 服务器安装使用指南04【AI】2026 年具身智能模型和世界模型总结05零基础教你claude code 接入 deepseek V406AI科技热点日报 | 2026年5月11日07codex app每次打开重连5次Reconnecting问题解决08人工智能最新动态 AI 日报 · 2026年5月10日09Cursor 接入 DeepSeek‑V4‑Pro 完整指南(2026 实测)10Gemini大升级、AI眼镜首发、Android XR亮相,13天后见分晓