บทนำ HTML
HTML
ต้นกำเนิดของภาษา HTML เกิดจาก เมื่อปี 1989 นักฟิสิกส์ชื่อ Tim Berners-Lee แห่งสถาบันวิจัย CERN เสนองานวิจัยเรื่อง prototyped ENQUIRE และ Hypertext system ใช้สำหรับนักวิจัยของสถาบันเพื่อแบ่งข้อมูลกัน และถูกพัฒนามาเรื่อยๆจนถึงปัจจุบันHTML เป็นตัวย่อมาจาก Hypertext Markup Language เป็นภาษาหลักที่ใช้ในการแสดงผลบนเว็บ บราวเซอร์ในอินเตอร์ โดยสามารถนำเสนอข้อมูลตัวอักษร รวมทั้งเชื่อมต่อเพื่อ แสดงภาพ , เสียง และไฟล์ในรูปแบบอื่นๆ
ภาษา HTML จะแบ่งออกเป็น 2 ส่วน คือ
1. ส่วนของคำสั่ง (tag) เป็นส่วนที่กำหนดรูปแบบของข้อความที่แสดง ซึ่งเราเรียกว่า Tag โดยจะอยู่ในเครื่องหมาย < ... >
2. ส่วนของบทความทั่วๆไป เป็นส่วนของข้อความที่เราต้องการแสดงผล
ตัวอย่างการใช้งานภาษา HTML
คุณอาจลองพิมพ์ตามตัวอักษรด้านล่างนี้ ใน Text editer ของคุณเช่น Notepad
|
<html> <head> <title> หัวข้อเรื่อง ของหน้านี้ </title> </head> <body> เนื้อหาที่จะแสดงใน web browser </body> </html> |
เมื่อคุณพิมพ์เสร็จก็ให้ save ในชื่อ mypage.html และลองใช้ web browser อย่าง internet explorer หรือ fire fox เปิดดูก็จะเห็นผลตามรูปด้านล่าง
การทำงานของ code ด้านบน
1. <html> ...... </html> ในการใช้งาน HTML เราจะต้องเริ่มด้วย <html> และปิดด้วย </html> เสมอ
2. <head> ...... </head> เป็นส่วนที่ใช้ให้รายละเอียดเกี่ยวกับ เว็บเพจหน้านี้ ซึ่งจะไม่แสดงให้เห็นในส่วนของการแสดงผลของ web browser แต่จะมีผลกับส่วนอื่นๆ เช่น การหาของ search engine (google,yahoo) การใช้งานก็จะมีคำสั่งย่อยเพื่อบรรยายรายละเอียด เช่น <title> .... </title> , <meta> และอื่นอีกมากมาย
3. <title> .......... </title> ในส่วนตัวอักษรที่อยู่ในคำสั่งนี้จะอยู่ใน title bar ของ web page
4. <body> .......... </body> ตัวอักษรที่อยู่ในคำสั่งนี้จะแสดงส่วนแสดงผลของ web browser
ในบทต่อไปเราจะอธิบายรายละเอียดของ คำสั่ง (tag) ให้ละเอียดขึ้น
เกี่ยวกับบทความนี้
- ระดับความยาก : พื้นฐาน
- คะแนนของบทความนี้ : 9
- สร้างเมื่อ : 16-05-2010
- จำนวนครั้งที่เปิด : 39,947
- เนื้อหาที่เกี่ยวข้อง :
- -
คลิกที่ เจ๋งเป้ง! เพื่อโหวตให้กับบทความนี้หากคิดว่าน่าสนใจ
บทความอื่นๆในหมวดลองทำเว็บไซต์ แบบง่ายๆ (12 เรื่อง)
บทนำ HTML
ที่มาของ HTML และพื้นฐานการใช้งาน HTML ในบทนี้จะเป็นต้องใช้โปรแกรมอย่าง Text editer ถ้าคุณยังไม่เคยใช้งานแนะนำให้อ่านหัวข้อ ลองทำเว็บแบบง่ายๆ ดูก่อนเพื่อเป็นพื้นฐานในการอ่านบทนี้
สร้างเมื่อ : 16-05-2010 9:01 | จำนวนครั้งที่เปิด : 39,947
โครงสร้างคำสั่งของ HTML
ในบทนี้จะเป็นโครงสร้างคำสั่ง(tag) ของ HTML
สร้างเมื่อ : 16-05-2010 10:12 | จำนวนครั้งที่เปิด : 117,921
คำสั่งในการจัดหน้า
ในบทนี้จะเป็นคำสั่ง Tag พื้นฐานของ HTML ในส่วนของ body section ที่ใช้ในการจัดหน้าเช่น จัดย่อหน้า จัดให้ชิดซ้าย ชิดขวา
สร้างเมื่อ : 16-05-2010 8:18 | จำนวนครั้งที่เปิด : 44,450
คำสั่งในการกำหนดลักษณะตัวอักษร และแสดงสัญลักษณ์ต่างๆ
ตัวเอียง ตัวหนา บทนี้จะบทคำสั่งที่เกี่ยวกับตัวอักษรทั้งหลายกัน รวมถึงสัญลักษณ์ต่างๆ
สร้างเมื่อ : 16-05-2010 8:18 | จำนวนครั้งที่เปิด : 43,237
เชื่อมต่อเอกสารของเราด้วย hyperlink
เว็บไซต์ของเราประกอบด้วย web page มากมาย ซึ่งเราจะใช้ hyperlink ในการเชื่อมโยงเอกสารเหล่านั้น
สร้างเมื่อ : 16-05-2010 8:19 | จำนวนครั้งที่เปิด : 24,417
แบ่งหน้าจอโดยใช้ Frame
ปรกติเราจะแสดงเว็บเพจใน browser ได้ที่ละ 1 เว็บเพจ แต่ถ้าเราใช้ Frame เราจะสามารถแสดงเว็บเพจได้หลายๆเว็บเพจในหน้าเดียว โดยจะแบ่งหน้าของ browser ออกเป็นส่วนๆ โดยใช้ Frame
สร้างเมื่อ : 16-05-2010 9:59 | จำนวนครั้งที่เปิด : 31,099
Table คำสั่งที่สำคัญสุดในการทำเว็บเพจ
ในหน้าเว็บเพจของเราประกอบด้วยข้อมูลมากมาย จึงจำเป็นที่จะต้องจัดเรียงข้อมูลให้เป็นระเบียบเพื่อให้อ่านงาน และใช้งานพื้นที่ได้คุ้มค่าที่สุด ซึ่งตารางจะช่วยเราได้มาก และนิยมใช้มากในการจัดรูปแบบหน้าตาของเว็บไซต์
สร้างเมื่อ : 16-05-2010 8:23 | จำนวนครั้งที่เปิด : 29,001
list จัดข้อมูลในเว็บเพจให้เป็นระเบียบ
list tag ใช้ในการจัดข้อมูลเป็นชุดๆ หรือเป็นหัวข้อ ซึ่งจะทำให้ข้อมูลอ่านได้ง่ายขึ้น
สร้างเมื่อ : 16-05-2010 8:23 | จำนวนครั้งที่เปิด : 16,611
การสร้างแบบฟอร์ม
เว็บไซต์นั้นต่างจากเอกสารธรรมดา ตรงที่สามารถตอบโต้กับผู้ใช้งานได้ เช่นการใช้ search (ค้นหา) ในเว็บไซต์ hellomyweb.com ช่องรับค่าของ search นั้นก็คือแบบฟอร์มใน html นั่นเอง
สร้างเมื่อ : 16-05-2010 8:37 | จำนวนครั้งที่เปิด : 29,443
การใส่รูปในเว็บเพจ
รูปนั้นสามารถบรรยายรายละเอียดได้ดีกว่าคำพูดมาก ดังนั้นแทบทุกเว็บไซต์จึงมีรูปอยู่เกือบทุกเว็บไซต์ ในบทความนี้เราจะมาใส่รูปในเว็บเพจกัน
สร้างเมื่อ : 16-05-2010 8:24 | จำนวนครั้งที่เปิด : 24,118
การใส่ภาพพื้นหลัง ให้เว็บเพจ
ภาพพื้นหลังเป็นสิ่งที่ทำให้เว็บของเราดูสวยงามแต่ถ้าเราใช้ภาพพื้นหลังที่ไม่ดี อาจส่งผลเสียกับเว็บเราได้ ในบทความนี้จะเป็นตัวอย่างของการใส่พื้นหลังที่ดี และไม่ดี
สร้างเมื่อ : 16-05-2010 10:17 | จำนวนครั้งที่เปิด : 118,235
การใช้งานสีในเว็บเพจ
สีสันนั้นอยู่คู่กับเว็บเพจอยู่แล้ว เพราะนอกจากจะทำให้เว็บดูสวยงามน่าสนใจแล้ว ยังช่วยให้การอธิบายข้อความดีขึ้นอีก ในบทความนี้เราจะมีดูการใช้งานสีกัน
สร้างเมื่อ : 16-05-2010 8:26 | จำนวนครั้งที่เปิด : 19,834
