RSS

HTML และ CSS

02 May

วันที่ : 2  พ.ค. 2554
เวลา : 13.00 – 17.00
สถานที่ : ฝ่ายบริการความรู้ทางวิทยาศาสตร์และเทคโนโลยี
ผู้ฝึกงาน : บุญเลิศ อรุณพิบูลย์

1. HTML (Hypertext Markup Language) เป็นภาษาหลักที่ใช้ในการสร้างโฮมเพจ จะประกอบไปด้วย tag เปิด และ tag ปิด ยกตัวอย่างเช่น <html>….</html>

  • โครงสร้าง HTML
  • รูปแบบคำสั่ง HTML จะประกอบด้วย
    <tag attribute = value> ตัวอย่างเช่น <font color = “red”>


2. CSS (Cascading Style Sheets)
เป็นภาษาที่มีรูปแบบการเขียน Syntax ที่มีความเฉพาะ ใช้ในการกำหนดรูปแบบเอกสารเว็บหรือตกแต่งเอกสาร HTML ให้มีหน้าตา สีสัน ตัวอักษร ตำแหน่ง เส้นขอบ พื้นหลัง ระยะห่าง ตามต้องการ โดยการกำหนดคุณสมบัติให้กับ Element ต่างๆ ของ HTML

  • ประโยชน์ของ CSS
    1. ช่วยจัดรูปแบบการแสดงผล ช่วยลดขนาดของไฟล์ HTML ทำให้ประมวลได้อย่างรวดเร็ว และประหยัดพื้นที่จัดเก็บ
    2. เนื่องจาก HTML ที่ทำงานคู่กับ CSS จะมีแต่ส่วนเนื้อหาทำให้ง่ายต่อการจัดการและสามารถนำ CSS นั้นไปใช้กับ HTML อื่นๆได้อีกด้วย จึงประหยัดเวลาในการพัฒนา (มีไฟล์เฉพาะในการตกแต่ง)
    3. ใช้งานได้ดีกับเทคโนโลยีใหม่ๆ เช่น การแสดงผลบนเบราว์เซอร์ใหม่ๆ การแสดงผลบนรูปแบบอื่นๆ อย่าง การสั่งพิมพ์ หรือบนมือถือ
  • External CSS  และ Internal CSS
    External CSS เป็นการเขียนไฟล์ CSS แยกออกจากเว็บเพจหรือ HTML ทำให้การแก้ไขทำได้ง่ายขึ้น (คำสั่ง CSS ทั้งหมดจะอยู่ในไฟล์ .css) หากเขียน CSS รวมในไฟล์ HTML จะเรียกว่า Internal CSS ซึ่งการประมวลผลจะให้ความสำคัญ Internal CSS ก่อน External CSS
  • การใช้งาน External CSS
    จะทำงานร่วมกับ HTML โดยการพิมพ์โค้ดของ CSS แทรกไปยังโค้ดของ HTML
    1. ใช้ CSS กับ Template ของ CMS, Blog tools, Wiki tools
    2. นำไปใช้โดยการใส่คำสั่ง <link rel=“stylesheet” href=“url” type=“text/css” />   โดยระบุไว้ใน head section
  • รูปแบบคำสั่ง CSS จะประกอบด้วย

selector{
property: Value
property: Value
}

ตัวอย่างเช่น

p {
color: red;
}

แหล่งข้อมูลที่ใช้เป็นเครื่องมือในการฝึกปฏิบัติงาน
– Slide ประกอบการบรรยายเรื่อง “CSS หัวใจสำคัญการพัฒนาเว็บยุคใหม่”

 

Tags: , ,

Comments are closed.

 
%d bloggers like this: