Page 43 - การสร้างเว็บไซต์
P. 43
ู
CSS และโครงสร ้างเวบไซต์ 2. ร ปเเบบค�ำสั่ง css
็
ด ้วย HTML เบื้องต ้น
2.1 รปเเบบของค�ำสั่ง css จะประกอบไปด้วย 2 ส่วนใหญ่ๆ คือ
ู
้
1. css เบืองต้น 2.1.1 Selector คือ ส่วนของค�ำสั่ง HTML หรือ Tag ที่เรำต้องกำรให้เเสดงผล เช่น
table กจะเเสดงในส่วนของตำรำง, กจะเปนกำรลิงก์, h1 กจะเปนขนำดตัวอักษร เปนต้น
็
็
็
็
็
็
ู
ึ
CSS (cascade Style Sheet) หมำยถง ภำษำที่ใช้ก�ำหนดรปเเบบกำรเสดงผล HTML 2.1.2 Declaration คือ ส่วนของกำรก�ำหนดค่ำให้กับ Selector ประกอบไปด้วย 2ส่วน
้
ถูกสร้ำงขนเพ่อใช้งำนร่วมกับ HTML ซึ่งโดยทั่วไปเล้ว HTML ใช้ส�ำหรับก�ำหนดรปโครงสร้ำง ได้เเก่
ื
ู
ึ
ู
ข้อมล ส่วน css ใช้ส�ำหรับก�ำหนดรปเเบบกำรเเสดงผล 1) Property คือ ส่วนของคุณสมบัติที่เรำต้องกำรให้เเสดง เช่น สีตัวอักษร, ชนดตัวอักษร,
ู
ิ
ู
ในกำรเเยกกำรเเสดงผลของเว็บเพจออกจำกข้อมลในเว็บเพจนั้น จะช่วยให้ง่ำยต่อกำร ขนำดตัวอักษร, สี, พนหลัง เปนต้น
้
็
ื
ู
ู
ี
เปลี่ยนเเปลงรปเเบบต่ำงๆ ในอนำคตที่อำจจะมกำรเปลี่ยนรปเเบบของเว็บเพจ เช่น ถ้ำเรำ 2) Value คือ ค่ำที่เรำต้องก�ำหนดให้กับ Property หรือเปนค่ำที่เรำต้องกำรให้เเสดง เช่น ตัว
็
็
ู
ี
ต้องกำรเปลี่ยนสีให้กับหัวข้อในเเท็ก <h2> ในทุกๆ เว็บเพจกเพยงเเต่เปลี่ยนรปที่เปนไฟล์ css อักษรสีเขยว,ตัวอักษรเเบบ Tahoma, ตัวอักษรขนำด 10pt เปนต้น
็
็
ี
ั
ู
็
ิ
ด้วยกัน ในปจจุบัน css เปนที่นยมอย่ำงมำกในกำรน�ำไปจัดรปเเบบให้กับเว็บเพจ ซึ่งก่อนที่จะม ี 2.2 ลักษณะกำรใช้งำน CSS แบ่งออกเปน 3 แบบ คือ
็
่
ู
css นั้นเรำใช้ตำรำงในกำรจัดวำงต�ำเเหนงต่ำงๆในเว็บเพจเเละใช้ค�ำสั่ง HTML ในกำรจัดรปเเบบ 2.2.1 แบบ Inline เปนกำรเขยนโค้ด Css ลงไปในแท็ก HTML ที่ต้องกำรให้เกดกำร
็
ี
ิ
ุ
ี
ู
ู
ี
ุ
ของข้อมล ซึ่งถ้ำมกำรเเก้ไขรปภำพหรือมกำรปรับปรงเว็บเพจจะเปนกำรย่งยำกมำก เพรำะต้อง แสดงผลและจะมผลต่อแท็กนั้นๆ เท่ำนั้น โดยมรปแบบดังน ้ ี
็
ี
ี
ู
็
เเก้ไขในทุกเว็บเพจเพ่อให้เปนไปตำมรปเเบบที่ต้องกำร <tag style="property:value; property:value,"
ื
ู
ั
ุ
ปจจุบัน CSS แบ่งเยน 4 ร่น ได้แก่ แอดทริบวด์ style ใช้ในกำรก�ำหนดค่ำสไตล์พรอปเพอร์ตีต่ำงๆ
็
้
็
ิ
็
1) CSS 1 ยอมรับเปนมำตรฐำน ธันวำคม ค.ศ. 1996 2.2.2 แบบ Embedded เปนกำรเขยนโค้ด CSS ลงไปในไฟส์ HIML เช่นกัน แต่จะรวม
ี
็
็
2) CSS 2 เริ่มร่ำง ค.ศ. 1997 ยอมรับเปนมำตรฐำน ทฤษภำคม ค.ศ. 1998 โค้ด
็
3) CSS 3 เริ่มร่ำง ค.ศ. 1998 ยอมรับเปนมำตรฐำน ทฤศจิกำยน ค.ศ. 2011 CSS ทั้งหมดไว้ภำยใต้แท็ก <head> โดยมรปแบบดังน ้ ี
ี
ู
4) CSS 4 เริ่มร่ำง 29 กันยำยน ค.ศ. 2009 <head>
<tile></itle>
<style type=*tex/css">
ี
็
2.2.3 เเบบ External เปนกำรเขยนเเบบเเยกโค้ด CSS ออกมำยังไฟล์ที่เเยกต่ำงหำก ซึ่งจะ
อยู่คนละที่กับไฟล์ HTML โดยจะมนำมสกลไฟล์ CSS ซึ่งจะมกำรเรียกร้องใช้รปเเบบ CSS จำก
ู
ี
ุ
ี
็
ู
ี
็
ไฟล์ HTML โดยมรปเเบบในกำรเขยน คือ จะเเบ่งออกเปน 2 ไฟล์ คือไฟล์ที่เปนหน้ำเว็บเพจ
ี
็
หรือไฟล์ HTML กับไฟล์ที่เปน CSS เช่น
ส่วนของไฟล์ HTMI:
38 39
