Quest Academy

Sass

Introduction to the Sass Challenges

Sass หรือ “Syntactically Awesome StyleSheets” เป็นส่วนขยายภาษาของ CSS เพิ่มคุณสมบัติที่ไม่สามารถใช้งานได้โดยใช้ไวยากรณ์ CSS พื้นฐาน Sass ช่วยให้นักพัฒนาสามารถลดความซับซ้อนและบำรุงรักษาสไตล์ชีตสำหรับโปรเจ็กต์ได้ง่ายขึ้น

Sass สามารถขยายภาษา CSS ได้เนื่องจากเป็นตัวประมวลผลล่วงหน้า ใช้รหัสที่เขียนโดยใช้ไวยากรณ์ Sass และแปลงเป็น CSS พื้นฐาน สิ่งนี้ช่วยให้คุณสร้างตัวแปรซ้อนกฎ CSS ไปยังผู้อื่นและนำเข้าไฟล์ Sass อื่น ๆ ได้ ผลลัพธ์ที่ได้คือมีขนาดกะทัดลัดมากขึ้นอ่าน Code ได้ง่ายขึ้น

มีไวยากรณ์สองแบบสำหรับ Sass สิ่งแรกที่เรียกว่า SCSS (Sassy CSS) และใช้ตลอดความท้าทายเหล่านี้เป็น่สวนเริมของไวยากรณ์ของ CSS ซึ่งหมายความว่าสไตล์ชีท CSS ที่ถูกต้องทุกไฟล์เป็นไฟล์ SCSS ที่ถูกต้องและมีความหมายเดียวกัน ไฟล์ที่ใช้ไวยากรณ์นี้มีนามสกุล SCSS

ไวยากรณ์ที่สองและเก่ากว่าเรียกว่าไวยากรณ์ที่เยื้อง (หรือบางครั้งก็เป็นเพียง “Sass”) ใช้การเยื้องแทนการใช้วงเล็บเพื่อระบุการซ้อนตัวเลือกและขึ้นบรรทัดใหม่แทนที่จะใช้เครื่องหมายอัฒภาคเพื่อแยกคุณสมบัติ ไฟล์ที่ใช้ไวยากรณ์นี้มีนามสกุล. sass

ส่วนนี้จะแนะนำคุณสมบัติพื้นฐานของ Sass

Sass

Store Data with Sass Variables

Nest CSS with Sass

Create Reusable CSS with Mixins

Use @if and @else to Add Logic To Your Styles

Use @for to Create a Sass Loop

Use @each to Map Over Items in a List

Apply a Style Until a Condition is Met with @while

Split Your Styles into Smaller Chunks with Partials

Extend One Set of CSS Styles to Another Element

Be the first to add a review.

Please, login to leave a review
Add to Wishlist

Archive