在CSS中，我們可以通過自定義快捷CSS來提高樣式編寫的效率。帶有數量的快捷CSS是其中一種常用的方式。通過設置變量，我們可以在不同的CSS屬性中使用相同的數值，從而避免了反復輸入相同的數值，減少了代碼量，提高了樣式編寫的效率。

:root {
--main-color: #428bca;
--font-size: 14px;
--border-radius: 10px;
}
.button {
background-color: var(--main-color);
color: #fff;
font-size: var(--font-size);
border-radius: var(--border-radius);
padding: 10px 20px;
}
.input {
border: 1px solid var(--main-color);
font-size: var(--font-size);
border-radius: var(--border-radius);
padding: 5px 10px;
}
.card {
background-color: #fff;
border: 1px solid var(--main-color);
border-radius: var(--border-radius);
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
padding: 10px;
}

如上代碼中，我們使用了:root偽類定義了三個全局變量--main-color、--font-size和--border-radius，分別代表主色調、字體大小和邊框圓角的數值。在.button、.input和.card這三個類中，我們使用了var()函數來調用這三個變量，達到了代碼復用的目的。

這種帶數量的快捷CSS不僅可以用于顏色值、字體大小和邊框圓角，還可以用于文本間距、元素間距、邊距和寬度等屬性的設定。通過合理使用變量，我們可以讓代碼更整潔、更易讀、更易維護。