เกี่ยวกับคอร์สนี้
เรียนคอร์สนี้ได้ 365 วัน
มีทั้งหมด 7 บทเรียน
วิดีโอความยาว 1 ชั่วโมง 5 นาที
เกี่ยวกับผู้สอน
ทัพพ์วริศ ชิณศิริรัตน์กุล
Cloud Tutorial

ผู้ก่อตั้ง เว็บไซต์ cloud-tutorial.com เพื่อเป็นแหล่งสอนน้องๆนักเรียน นักศึกษา หรือผู้ที่สนใจในการออกแบบพัฒนาเว็บไซต์ โดยการสอนผ่านรูปแบบ วิดีโอ ฟรี โดยเนื้อหาส่วนมากจะเป็นการสอนด้วยเครื่องมือใหม่ๆ ซึ่งนิยมในต่างประเทศแต่ในไทยยังไม่แพร่หลาย เพื่อให้คนไทยได้รู้จักคุ้นเคยและใช้ในการทำงานจริง

สอนเขียน CSS ด้วย Sass ฉบับมือใหม่

คอร์สเรียนการเขียน CSS และ CSS3 ด้วย Sass สำหรับหรือมือใหม่

โดย ทัพพ์วริศ ชิณศิริรัตน์กุล
เข้าเรียนฟรี
wishlist


สวัสดีครับก่อนจะเริ่มเรียนในคอร์ส สอนเขียน CSS ด้วย Sass นี้เราก็มาคุยกันก่อนเล็กๆน้อยๆนะครับ อันดับแรกเลยการที่เราจะทำเว็บไซต์ให้สวยงามเนี่ย เราคงใช้แค่ภาษา Html อย่างเดียวไม่ได้ใช่มั้ยครับ ? ดังนั้นเราจึงต้องใช้ CSS เข้ามาช่วย CSS หรือ Cascade Style Sheet เป็นภาษาสำหรับใช้ในการจัดการองค์ประกอบต่างๆของหน้าเว็บไซต์เราให้สวยงามโดยการกำหนด selector ในรูปแบบต่างๆตามที่เราต้อง โดยการเขียน CSS นั้นก็ไม่ได้ยุ่งยากอะไรมากมาย เพียงแต่ว่า ปัจจุบันนี้มีเครื่องมือที่เรียกว่า CSS Preprocessor เข้ามาช่วยให้การเขียน CSS นั้นสะดวกสบายยิ่งขึ้นนะครับ

CSS Preprocessor คืออะไร ?

ความหมายของ CSS Preprocessor ก็ตามชื่อมันเลยนะครับต้องมีการ Process ก่อนจึงจะใช้งานได้นั่นก็หมายความว่าเราจะเขียน CSS ของเราในอีกรูปแบบนึง จากนั้นพอเราจะใช้งานเราก็นำมันมาทำการ Process ก่อน หรือเราจะเรียกว่าทำการ Compile เพื่อนำมาใช้งานนั่นเอง โดย Sass ก็เป็นหนึ่งใน CSS Preprocessor นะครับ แล้ว Sass คืออะไร ?

Sass คืออะไร ?

Sass ชื่อเต็มๆคือ Syntactically Awesome Stylesheets เป็น CSS Proprocessor อีกหนึ่งตัวซึ่งกำลังเป็นที่นิยมทั่วโลกในไทยเองก็มีผู้เริ่มใช้บ้างแล้ว และเจ้าตัว Sass เนี่ยมันมีดียังไงทำไมเราถึงต้องเรียนมัน ผู้อ่านคงอยากรู้ถึงประโยชน์และข้อดีของมันแล้วใช่มั้ยครับ ?

<

ความสามารถของ Sass

ความสามารถหลักของ Sass ก็จะคล้ายๆกับ CSS Preprocessor ทั่วๆไปนะครับโดยจะเป็นเรื่องของ

  • Nested
  • Variables
  • Mixins
  • Inheritance / Extend
  • Operations

ข้อดีที่ทำให้ Sass เหนือกว่า CSS Preprocessor ตัวอื่นๆ

  • Sass ทำงานบน Ruby จึงทำให้ประสิทธิภาพตอนเขียนโค๊ดและการประมวลผลเร็วกว่าเจ้าอื่นๆ แน่นอน
  • Sass มีชุดคำสั่งหรือ Library ให้เราเลือกใช้มากมายซึ่งจะช่วยให้การเขียน CSS ของเรานั้นง่ายขึ้นมาก
  • Sass มี 2 รูปแบบให้เลือกเขียนทั้ง .sass และ .scss
  • .scss มีรูปแบบการเขียนเหมือน CSS ทั่วไปทำให้ง่ายต่อการศึกษา

บทเรียน การเขียน CSS ด้วย Sass
เวลา(นาที)
ตอนที่ 1 - Sass คืออะไร ? 6.05  
ตอนที่ 2 - เริ่มใช้งาน Sass 11.05  
ตอนที่ 3 - การใช้งาน Nested 18.03  
ตอนที่ 4 - การใช้งาน Variables 12.00  
ตอนที่ 5 - การใช้งาน Mixins 12.42  
ตอนที่ 6 - การใช้งาน Operators 2.16  
ตอนที่ 7 - การใช้งาน Extend/Inheritance 3.34  
ไม่มีเอกสารประกอบการเรียน

รีวิวคอร์สจากผู้เรียน

4
2
0
0
0
เฉลี่ย
4.6/5.0
  • เยี่ยมเลย เข้าใจง่ายมากครับ
    Sarunsak Phonwa

  • สวดยอด
    Varich Boonsanong

  • ขอบคุณสำหรับความรู้ดีๆครับเข้าใจง่ายมากๆ
    Sathaporn Thissarak

  • แจ่มมากๆครับสำหรับคอร์สเริ่ม โปรแกรมใช้งานง่ายแล้วก็อธิบายเข้าใจง่ายดี
    อภินันท์ วงค์อินต๊ะวัง

  • ดีมากเลยค่ะ ขอบคุณนะคะ :)
    เพชรพลอย จิรชัยสกุล

  • เข้าใจง่าย คนสอนพูดรู้เรื่อง ใครที่สนใจไม่ต้องลังเล เข้ามาฟังเลยครับ สาระ 100%
    Sky Fall