การสอน CSS

CSS ใช้เพื่อควบคุมรูปแบบของเอกสารเว็บด้วยวิธีที่ง่ายและสะดวก

CSS เป็นคำย่อของ "Cascading Style Sheet". บทช่วยสอนนี้ครอบคลุมทั้งเวอร์ชัน CSS1, CSS2 และ CSS3 และให้ความเข้าใจที่สมบูรณ์เกี่ยวกับ CSS ตั้งแต่พื้นฐานไปจนถึงแนวคิดขั้นสูง

ทำไมต้องเรียนรู้ CSS?

Cascading Style Sheetsเรียกด้วยความรักว่า CSSเป็นภาษาการออกแบบที่เรียบง่ายซึ่งมีไว้เพื่อลดความซับซ้อนของกระบวนการทำให้หน้าเว็บแสดง

CSSเป็นสิ่งจำเป็นสำหรับนักเรียนและผู้เชี่ยวชาญด้านการทำงานในการเป็น Software Engineer ที่ยอดเยี่ยมโดยเฉพาะเมื่อพวกเขาทำงานในโดเมนการพัฒนาเว็บ ฉันจะแสดงข้อดีบางประการของการเรียนรู้ CSS:

  • Create Stunning Web site- CSS จัดการกับรูปลักษณ์ส่วนหนึ่งของหน้าเว็บ การใช้ CSS คุณสามารถควบคุมสีของข้อความรูปแบบของฟอนต์ระยะห่างระหว่างย่อหน้าการกำหนดขนาดและการจัดวางคอลัมน์ภาพพื้นหลังหรือสีที่ใช้การออกแบบเค้าโครงรูปแบบต่างๆในการแสดงผลสำหรับอุปกรณ์และขนาดหน้าจอต่างๆ รวมถึงเอฟเฟกต์อื่น ๆ อีกมากมาย

  • Become a web designer - หากคุณต้องการเริ่มต้น carrer ในฐานะนักออกแบบเว็บไซต์มืออาชีพการออกแบบ HTML และ CSS เป็นสิ่งที่ต้องมี

  • Control web- CSS นั้นง่ายต่อการเรียนรู้และทำความเข้าใจ แต่ให้การควบคุมที่มีประสิทธิภาพในการนำเสนอเอกสาร HTML โดยทั่วไป CSS จะรวมกับภาษามาร์กอัป HTML หรือ XHTML

  • Learn other languages - เมื่อคุณเข้าใจพื้นฐานของ HTML และ CSS แล้วเทคโนโลยีอื่น ๆ ที่เกี่ยวข้องเช่น javascript, php หรือเชิงมุมจะเข้าใจง่ายขึ้น

สวัสดีชาวโลกโดยใช้ CSS

เพื่อให้คุณรู้สึกตื่นเต้นเล็กน้อยเกี่ยวกับ CSS ฉันจะให้โปรแกรม CSS Hello World ธรรมดาขนาดเล็กคุณสามารถลองใช้ลิงก์สาธิต

<!DOCTYPE html>
<html>
   <head>
      <title>This is document title</title>
      <style>
      h1 {
         color: #36CFFF; 
      }
      </style>
   </head>	
   <body>
      <h1>Hello World!</h1>
   </body>	
</html>

การใช้งาน CSS

ดังที่ได้กล่าวไว้ก่อนหน้านี้ CSS เป็นหนึ่งในภาษาสไตล์ที่ใช้กันอย่างแพร่หลายบนเว็บ ฉันจะแสดงรายการบางส่วนที่นี่:

  • CSS saves time- คุณสามารถเขียน CSS หนึ่งครั้งจากนั้นใช้ชีตเดียวกันซ้ำในหลาย ๆ หน้า HTML คุณสามารถกำหนดสไตล์สำหรับแต่ละองค์ประกอบ HTML และนำไปใช้กับเว็บเพจได้มากเท่าที่คุณต้องการ

  • Pages load faster- หากคุณใช้ CSS คุณไม่จำเป็นต้องเขียนแอตทริบิวต์แท็ก HTML ทุกครั้ง เพียงเขียนกฎ CSS ของแท็กหนึ่งกฎและนำไปใช้กับเหตุการณ์ทั้งหมดของแท็ก โค้ดที่น้อยลงจึงทำให้ดาวน์โหลดได้เร็วขึ้น

  • Easy maintenance - หากต้องการเปลี่ยนแปลงทั่วโลกเพียงแค่เปลี่ยนรูปแบบและองค์ประกอบทั้งหมดในหน้าเว็บทั้งหมดจะได้รับการอัปเดตโดยอัตโนมัติ

  • Superior styles to HTML - CSS มีอาร์เรย์ของแอตทริบิวต์ที่กว้างกว่า HTML มากดังนั้นคุณสามารถทำให้หน้า HTML ของคุณดูดีขึ้นมากเมื่อเทียบกับแอตทริบิวต์ HTML

  • Multiple Device Compatibility- สไตล์ชีตอนุญาตให้ปรับแต่งเนื้อหาสำหรับอุปกรณ์มากกว่าหนึ่งประเภท ด้วยการใช้เอกสาร HTML เดียวกันเว็บไซต์เวอร์ชันต่างๆสามารถนำเสนอสำหรับอุปกรณ์พกพาเช่นพีดีเอและโทรศัพท์มือถือหรือสำหรับการพิมพ์

  • Global web standards - ขณะนี้แอตทริบิวต์ HTML กำลังเลิกใช้งานและขอแนะนำให้ใช้ CSS ดังนั้นจึงเป็นความคิดที่ดีที่จะเริ่มใช้ CSS ในหน้า HTML ทั้งหมดเพื่อให้เข้ากันได้กับเบราว์เซอร์ในอนาคต

ผู้ชม

นี้ CSS tutorial จะช่วยให้ทั้งนักเรียนและผู้เชี่ยวชาญที่ต้องการทำให้เว็บไซต์หรือบล็อกส่วนตัวน่าสนใจยิ่งขึ้น

ข้อกำหนดเบื้องต้น

คุณควรคุ้นเคยกับ:

  • การประมวลผลคำพื้นฐานโดยใช้โปรแกรมแก้ไขข้อความใด ๆ
  • วิธีสร้างไดเร็กทอรีและไฟล์
  • วิธีนำทางผ่านไดเรกทอรีต่างๆ
  • ท่องอินเทอร์เน็ตโดยใช้เบราว์เซอร์ยอดนิยมเช่น Internet Explorer หรือ Firefox
  • การพัฒนาหน้าเว็บง่ายๆโดยใช้ HTML หรือ XHTML

หากคุณเพิ่งเริ่มใช้ HTML และ XHTML เราขอแนะนำให้คุณอ่านบทแนะนำ HTML หรือ XHTML Tutorial ก่อน