ก่อนเริ่ม...
 ผมเองเริ่มเขียนโฮมเพจด้วย Notepad เป็นเมื่อประมาณปลายปีที่แล้ว แหล่งความรู้ที่ได้
ก็มาจาก ไป view document source ของคนอื่นบ้าง อ่านจากหนังสือบ้าง ดูตาม website
ที่สอนบ้าง ผมเริ่มจาก 0 เลยก็ว่าได้กับ html ถึงเวลานี้ผมเองก็ไม่ได้มีความรู้อย่างแท้จริง
ในคำสั่ง html แต่ก็พอจะมีอยู่บ้าง ที่ตรงนี้คงเหมาะกับคนที่ไม่รู้จักกับคำสั่ง html แต่อยาก
จะเขียนเป็น แต่สำหรับคนที่มีความรู้แล้วคงไม่ได้ประโยชน์อะไรมากนะครับ.. ผมคงใช้วิธี
แนะนำตามความเข้าใจของผม ซึ่งอาจจะไม่ถูกต้องตามหลักวิชาการนะครับ
เพราะฉะนั้นแล้วควรจะหาความรู้จากที่อื่นมาเพิ่มเติมด้วยนะครับ
ขอบคุณครับ
นาย bEE
17/08/1998


HTML คืออะไร?
 HTML ย่อมาจาก Hyper Text Markup Language ซึ่งจริงๆแล้วก็คือ text file ธรรมดาๆนี่เอง
โดยปกติจะมีนามสกุลเป็น .TXT แต่เพราะเป็น text ที่ไม่ธรรมดาจึงต้องมีนามสกุลเป็น .htm หรือ
.html ครับ ดังนั้นเราจึงสามารถที่จะใช้ text editor ทั่วๆไปเขียนหรือแก้ไขได้ หรือจะใช้โปรแกรม
สำหรับเขียน html โดยตรงเลยก็ได้ครับ...

เริ่มต้นกันดีกว่า
 เดี๋ยวครับก่อนเริ่มเขียนคุณช่วยสร้าง sub directory ใน drive c: ชื่อ myweb ไว้ก่อนนะครับ
เพื่อที่คุณจะได้ไม่งงตอนที่ผมแนะนำนะครับ... ขอบคุณจ้า

 ให้คุณเปิด Notepad แล้วพิมพ์ตามตัวหนังสือสีฟ้าข้างล่างเลยนะครับ <html> <head> <title>โฮมเพจแรกของฉัน</title> </head> <body bgcolor="#000000" text="#ffffff" link="#ff5500" vlink="#ffff00"> โฮมเพจแรกของฉัน<br> เขียนโดยนาย bEE </body> </html> เมื่อคุณพิมพ์เสร็จแล้วให้คุณ save เป็นชื่อ index.htm เก็บลงใน sub directory c:\myweb นะครับ
คุณ save ไฟล์ index.htm เรียบร้อยแล้วทีนี้เราจะไปดูหน้าตาโฮมเพจแรกที่คุณเขียนขึ้นมากันครับ
ให้คุณเปิด Netscape หรือ IE แล้วพิมพ์ตรง Location ตามนี้ c:/myweb/index.htm
 แล้วกด enterคุณก็จะได้เห็นหน้าตาโฮมเพจแรกที่เขียนขึ้นด้วยตัวคุณเอง โดย
สิ่งที่คุณเห็นจะเป็นพื้นสีดำ ตัวหนังสือสีขาวอยู่มุมบนด้านซ้ายมือมีข้อความว่า

โฮมเพจแรกของฉัน
เขียนโดยนาย bEE

***ตัวหนังสืออาจไม่เหมือนกัน ไม่ต้องตกใจนะครับ เราจะแนะนำกันในตอนต่อไป
เห็นไหมครับไม่ยากเลย แค่นี้คุณก็จะพิมพ์ๆๆข้อความที่คุณต้องการลงในโฮมเพจ
คุณได้แล้ว ลองเปลี่ยนข้อความดูนะครับ

โครงสร้างของ html document มีง่ายๆดังนี้
+---<html> | +-<head> | | <title></title> | +-</head> | +-<body> | | | | | | ตรงนี้เป็นข้อมูลที่เราจะนำเสนอ | | | | | +-</body> +---</html>
มาดูคำสั่งที่ใช้กันดีกว่า
 คำสั่งที่อยู่ในเครื่องหมายน้อยกว่า มากกว่า เราเรียกว่า TAG ซึ่งต่อไปนี้ผมจะเรียก
ว่า TAG นะครับ TAG บางตัวต้องมี TAG เปิดและ TAG ปิดซึ่ง TAG ปิดก็เพียง
เติมเครื่องหมาย / เข้าไปตามตัวอย่างข้างล่างครับ แต่บางตัวก็ไม่ต้องมี TAG ปิด <tag></tag> ทีนี้เรามาดู TAG ที่เราเขียนไปใน index.htm ว่ามีความหมายอย่างไรบ้าง
<html> </html> TAG นี้ต้องอยู่ครอบ html document code ของเราครับ
<head> </head> เป็นส่วนหัวของ html document โดย TAG ที่จะอยู่ใน head นี้จะมี title
<title> </title> ชื่อก็บอกอยู่แล้วครับว่า title เป็นการระบุชื่อโฮมเพจของเราโดยข้อความ
ที่คุณใส่อยู่ระหว่าง TAG title จะปรากฎอยู่บน Title Bar ของ Browser
<body bgcolor="#000000" text="#ffffff" link="#ff5500" vlink="#ffff00" alink="#ffffff"> </body> คุณจะเห็นว่า TAG นี้มีค่าอะไรวุ่นวายไปหมด ไม่ต้องงงครับ เรามาทำความรู้จักกันดีกว่า
TAG body นี้มีค่า Attribute ต่างๆที่จะกำหนดหน้าตาของโฮมเพจของเราดังนี้

bgcolor เป็นการระบุสีพื้นของโฮมเพจเรา
text กำหนดสีตัวอักษรปกติ
link กำหนดสีข้อความที่มีการเชื่อนโยงไปยัง page อื่น ที่เรายังไม่เคยไป
vlink กำหนดสีข้อความที่มีการเชื่อมโยงไปยัง page อื่น ที่เราเคยไปมาแล้ว
alink กำหนดสีข้อความที่มีการเชื่อมโยงไปยัง page อื่น ในขณะที่กำลังกดเมาส์ค้างอยู่

เราจะเห็นว่าค่าสีมี 6 หลัก (ไม่นับเครื่องหมาย #) แบ่งเป็น 3 คู่ คู่ละ 2 หลัก
คู่แรก(ตำแหน่งที่ 1-2) แทนค่าสีแดง
คู่สอง(ตำแหน่งที่ 3-4) แทนค่าสีเขียว
คู่ที่สาม(ตำแหน่งที่ 5-6) แทนค่าสีน้ำเงิน
rrggbb
โดยมีค่าตั้งแต่ 00 ถึง ff (เลขฐาน 16)ซึ่งคุณสามารถที่จะลองผสมสีดูเองได้ครับ ตัวอย่างเช่น
#FF0000 #00FF00 #0000FF #FFFF00 #FF00FF #00FFFF #FFaa00 #FF99FF #8800FF
<br> TAG นี้เป็นการขึ้นบรรทัดใหม่ (ไม่ต้องมี TAG ปิดครับ)


บ้านบี 2541 | มุมสบาย | ตอนที่ 2
1