自訂通用類別 (utilities)
width
- responsive: trnu,
- 5: 5%,
- 10: 10%,
- 15: 15%,
- 20: 20%,
- 25: 25%,
- 30: 30%,
- 35: 35%,
- 40: 40%,
- 45: 45%,
- 50: 50%,
- 55: 55%,
- 60: 60%,
- 65: 65%,
- 70: 70%,
- 75: 75%,
- 80: 80%,
- 85: 85%,
- 90: 90%,
- 95: 95%,
- 100: 100%,
- auto: auto
spacers (注意單位)
由變數 $spacers 設定，以 4 px 做為基數。
- 0: 0,
- 1: 1spacer / 4, (4 px)
- 2: 1spacer / 2, (8 px)
- 3: 1spacer * .75, (12 px)
- 4: 1spacer, (16 px)
- 5: 1spacer * 1.25, (20 px)
- 6: 1spacer * 1.5, (24 px)
- 7: 1spacer * 1.75, (28 px)
- 8: 1spacer * 2, (32 px)
- 9: 1spacer * 2.25, (36 px)
- 10: 1spacer * 2.5, (40 px)
- 11: 1spacer * 2.75, (44 px)
- 12: 1spacer * 3, (48 px)
font-size
- responsive: true,
- 1: 12px,
- 2: 14px,
- 3: 16px,
- 4: 18px,
- 5: 20px,
- 6: 22px,
- 7: 24px,
- 8: 26px,
- 9: 28px,
- 10: 30px,
- 11: 32px,
font-weight
- light: $font-weight-light, (lighter)
- lighter: $font-weight-lighter, (300)
- normal: $font-weight-normal, (400)
- bold: $font-weight-bold, (700)
- bolder: $font-weight-bolder, (bolder)
- "100": 100,
- "200": 200,
- "300": 300,
- "400": 400,
- "500": 500,
- "600": 600,
- "700": 700,
- "800": 800,
- "900": 900
line-height (注意單位)
- responsive: true,
- 1: 1,
- sm: 1line-height-sm, (1.5)
- base: 1line-height-base, (1.25)
- lg: 1line-height-lg, (2)
- 20: 20px,
- 22: 22px,
- 23: 23px,
- 24: 24px,
- 25: 25px,
- 26: 26px,
- 27: 27px,
- 28: 28px,
- 29: 29px,
- 30: 30px,
- 31: 31px,
- 32: 32px,
- 33: 33px,
- 34: 34px,
- 35: 35px,
- 36: 36px,
- 37: 37px,
- 38: 38px,
- 39: 39px,
- 40: 40px,
- 47: 47px,
- 56: 56px,
letter-spacing
- responsive: true,
- "normal": normal, (預設值，單字或段落間的水平距離為預設效果)
- "inherit": inherit, (繼承自父層的 word-spacing 屬性值)
- 0: 0px,
- 017: 0.17px,
- 020: 0.20px,
- 060: 0.60px,
- 070: 0.70px,
- 080: 0.80px,
- 100: 1.00px,
- 160: 1.60px,
- 175: 1.75px,
- 190: 1.90px,
- 200: 2.00px,
- 225: 2.25px,
- 300: 3px