.scss
Code
SCSS (Sassy CSS)
SCSS เป็นไวยากรณ์สมัยใหม่ของ Sass ซึ่งเป็นพรีโปรเซสเซอร์ CSS ที่ได้รับความนิยมมากที่สุด ใช้ไวยากรณ์ที่เป็นซูเปอร์เซตของ CSS (วงเล็บปีกกาและเซมิโคลอน) ทำให้เขียน CSS ที่ดูแลรักษาได้ง่ายและมีโครงสร้าง
ประเภท MIME
text/x-scss
ประเภท
ข้อความ
การบีบอัด
ไม่สูญเสียคุณภาพ
ข้อดี
- + CSS-compatible syntax — any CSS is valid SCSS
- + Powerful module system (@use, @forward) for large projects
- + Rich built-in functions for colors, math, and lists
- + Industry standard in enterprise design systems
ข้อเสีย
- − Requires a compilation step (Dart Sass or build tool)
- − Native CSS custom properties and nesting reduce the need for SCSS
- − Large projects can have complex dependency graphs
เมื่อใดควรใช้ .SCSS
ใช้ SCSS สำหรับสไตล์ชีตที่ซับซ้อน ระบบการออกแบบ และโปรเจกต์ที่ได้ประโยชน์จากตัวแปร mixins และสถาปัตยกรรม CSS แบบโมดูลาร์
รายละเอียดทางเทคนิค
ไฟล์ SCSS คอมไพล์เป็น CSS ผ่าน Dart Sass (การใช้งานอ้างอิง) คุณสมบัติรวมถึง $variables, @mixin/@include, การซ้อน, พาร์เชียล (_file.scss) และระบบโมดูล @use/@forward
ประวัติ
Hampton Catlin สร้าง Sass ในปี 2006 ด้วยไวยากรณ์ใช้การเยื้อง SCSS (Sassy CSS) แนะนำใน Sass 3.0 (2010) ด้วยไวยากรณ์ที่เข้ากันได้กับ CSS ทำให้เปลี่ยนจาก CSS ปกติได้ง่ายขึ้น