Technology

CSS คืออะไร และทำงานยังไง

2023-09-19 03:43:27


CSS คืออะไร และทำงานยังไง


Cascading Style Sheets (CSS) คือภาษาที่ถูกสร้างเพื่อสไตล์ของหน้าเว็บไซต์ ซึ่งทำงานร่วมกับ HTML โดยCSS ถูกพัฒนาขึ้นในปี 1996 โดยW3C (World Wide Web Consortium) เพื่อแก้ไขปัญหาหน้าเว็บมีแบบอักษร สี พื้นหลัง และสไตล์การจัดหน้าที่แตกต่างกัน เพราะHTML นั้นไม่ได้ออกแบบมาแท็กที่เข้ามาช่วยในการจัดรูปแบบหน้าเว็บโดยแบ่งเป็น 3 ประเภท


ขั้นตอนการทำงานของ CSS

CSS นั้นสามารถทำงานได้โดยการใช้ภาษาอังกฤษในการเขียนคำสั่งอย่างง่ายเป็นชุดคำสั่งต่าง ๆ โดยทำงานร่วมกับ HTML ดังนี้




< ส่วนหัว HTML> ตามด้วยส่วน CSS หลังวงเล็บ { } เช่น {color:red; font-size:12px;}  ในการแสดงผลก็จะแสดงผลตามค่า CSS ที่เรากำหนดไว้


ประเภทของ CSS

1.Inline CSS คือ โค้ดที่มีการฝังลงไปในบรรทัด Teg ของHTML ซึ่งจะทำให้ข้อมูลหรือ Object ที่มี Teg ที่มีการใช้ CSS แสดงออกมาตามที่ได้เขียนโค้ดไว้ เช่น การกำหนดค่าสี



ตามภาพจะมีการกำหนดค่าของ Teg ไว้คือ <body> เป็นสีน้ำเงิน และ

หัวข้อเป็นสีเขียว และเมื่อเปิด

ใหม่ก็ยังเป็นตามค่าสีที่เรากำหนดไว้ และนอกจากนี้เรายังสามารถกำหนดค่าที่แตกต่างกันไว้ได้อีกมากมาย



2.Internal or embedded CSS คือโค้ดที่เขียนลงไปรวมกับโค้ดของ HTML ซึ่งตัวโค้ดจะอยู่ในส่วนเดียวกัน เช่น



3.External CSS คือ โค้ดที่ใช้ในการแยกเก็บไฟล์ไว้ด้านนนอกไฟล์เว็บไซต์ซึ่งทำงานโดยการ Link และ Import เช่น

  • แบบ link คือการแนบลิงก์ไปยังเว็บไซต์อื่น


  • แบบ import 




ข้อดี

  • ทำให้หน้าเว็บสวยงาม
  • ลดจำนวนการเขียนโค้ดซ้ำ
  • ปรับแต่งไฟล์ได้
  • ประหยัดพื้นที่เซิร์ฟเวอร์
ร่วมเเสดงความคิดเห็น :