CSS Variable 除了能用在 Numeric 外，也可使用於 Shorthand。
Version
CSS 3
Shorthand
將 border 設定成 紅色 且為 1px。
<template>
<div class="title">CSS</div>
</template>
<style scoped>
* {
--border-1-red: 1px solid red;
}
.title {
border: var(--border-1-red)
}
</style>
第 6 行
* {
--border-1-red: 1px solid red;
}
--border-1-red：border是實務上常使用的 shorthand，也可一次設定成 CSS variable
10 行
.title {
border: var(--border-1-red)
}
border：使用---border-1-red一次設定給border
Conclusion
- 除了 Numeric 外，shorthand 也能用於 CSS variable