【css】css统一设置变量

scss

1. 使用变量
css 复制代码
$one-screen-height: 100vh;

.main {
	height: @one-screen-height;
}
2.结合css自定义属性
css 复制代码
:root {
  --common-height: 40px;
}
 
.button {
  height: var(--common-height);
}
 
.input {
  height: var(--common-height);
}
相关推荐
Codebee5 小时前
使用Qoder 改造前端UI/UE升级改造实践:从传统界面到现代化体验的华丽蜕变
前端·人工智能
叫我詹躲躲5 小时前
开发提速?Vue3模板隐藏技巧来了
前端·vue.js·ai编程
华仔啊5 小时前
面试都被问懵了?CSS 的 flex:1 和 flex:auto 真不是一回事!90%的人都搞错了
前端·javascript
前端康师傅5 小时前
JavaScript 函数详解
前端·javascript
金金金__5 小时前
antd v5 support React is 16 ~ 18. see https://u.ant.design/v5-for-19 for...
前端
会豪5 小时前
工业仿真(simulation)--前端(二)-资源管理器
前端
@小红花6 小时前
从0到1学习Vue框架Day03
前端·javascript·vue.js·学习·ecmascript
前端与小赵6 小时前
vue3中 ref() 和 reactive() 的区别
前端·javascript·vue.js
魔云连洲6 小时前
Vue的响应式底层原理:Proxy vs defineProperty
前端·javascript·vue.js
专注VB编程开发20年6 小时前
CSS定义网格的列模板grid-template-columns什么意思,为什么要用这么复杂的单词
前端·css