วันอังคารที่ 28 มีนาคม พ.ศ. 2560

ใบงานที่10 เรื่อง รูปเเบบของคำสั่ง HTML

รูปเเบบของคำสั่ง HTML

ภาษา HTML นั้นไม่ได้มีรูปแบบเป็นภาษาคอมพิวเตอร์ ที่ยากจะเข้าใจ เช่น ภาษา C, Pascal, Java เป็นต้น เพราะภาษา HTML มีรูปแบบคำสั่งง่ายๆ คล้ายกับภาษาที่ใช้กันอยู่ทั่วๆไป เป็นรูปแบบตายตัว และเข้าใจง่าย โดยภาษา HTML นั้น จะมีการใช้คำสั่งอยู่ภายใต้ เครื่องหมาย < > และจะใช้ เครื่องหมาย / เพื่อจบคำสั่งนั้นๆ โดยหลักในการเขียนเว็บเพจนั้นผมขอเสนอแนะขั้นตอน ซึ่งเป็นทางเลือกหนึ่งในการสร้างเว็บเพจ ดังต่อไปนี้

1. สิ่งที่ต้องการนำเสนอ ผู้พัฒนาจะต้องเตรียมข้อมูลต่างๆ ที่ต้องการนำมาเสนอลงบน Webpage โดยผู้พัฒนาอาจสร้างทีมงานขึ้นมาและแบ่งหน้าที่ในการทำงาน เช่น การหาข้อมูลข่าวสาร, การแบ่งหน้าที่ในการเขียน HTML รวมไปถึงการ Update ข้อมูลบนเว็บ เป็นต้น

2. สร้างโครงร่างคร่าวๆ ลงในกระดาษ ผู้พัฒนาควรวาดโครงร่างรูปแบบของ Webpage คร่าวๆลงในกระดาษก่อนเพื่อดูรูปแบบโดยรวมแบบกว้างๆ ของหน้าจอเรา ว่าควรจะมีโครงสร้างแบบไหน ใช้รูปภาพและข้อความอะไร วางไว้ตำแหน่งไหนบนหน้าจอบ้าง

3. เริ่มเขียน Webpage เริ่มต้นเขียน Webpage โดยภาษาที่ถนัด โดยทั่วไปเราจะใช้ภาษา HTML ในการเขียน ส่วนในการกำหนดลูกเล่น หรือใช้ระบบฐานข้อมูลบนเว็บเราอาจจะใช้ภาษา Scriptเข้ามาช่วย เช่น Java, CGI, Perl, PHP, ASP ฯลฯ เพราะ มาตรฐานของภาษา HTML นั้นไม่สามารถจัดการฐานข้อมูลได้

4. นำ Webpage ขึ้นไปวางบน Server ในส่วนนี้เจ้าของ Server จะเป็นผู้จัดการวางไฟล์ต่างๆ ที่ได้สร้างเรียบร้อยแล้วไว้บน Server เพื่อเปิดให้ผู้บริการให้ผู้สนใจเข้าชม


 คําสั่งพื้นฐาน
< !-- ขอความ --> คําสั่ง หมายเหตุ ใชอธิบายความหมาย ขื่อผูเขียนโปรแกรม และอื่นๆ
<br> คําสั่งขึ้นบรรทดใหม ั 
<p> ขอความ </p> คําสั่งยอหนาใหม
<hr width = "50%" size = "3"> คําสั่ง ตีเสน, กําหนดขนาดเสน
&nbsp; คําสั่ง เพิ่มชองวาง
<IMG SRC = "PHOTO.GIF"> คําสั่งแสดงรูปภาพชื่อ Photo.gif
<CENTER> ขอความ </CENTER> คําสั่งจัดใหขอความอยูกึ่งกลาง
<HTML> </HTML> คําสั่ง <HTML> คือคําสั่งเรมติ่ นในการเขียนโปรแกรม HTML และมคี ําสั่ง </HTML> เพื่อ
บอกจุดสิ้นสุดโปรแกรม
<HEAD> </HEAD> คําสั่ง <HEAD> คือคําสั่งบอกสวนที่เปนชื่อเรื่อง โดยมีคาสํ ั่งยอย <TITLE> อยูภายใน
<TITLE> </TITLE> คําสั่ง <TITLE> คือคําสั่งบอกชื่อเรื่อง จะไปปรากฏที่ Title Bar
<BODY> </BODY> คําสั่ง <BODY> คือคําสั่งบอกสวนเนื้อเรื่อง ที่จะถูกแสดงผลในเวปบราวเซอรประกอบดวย
รูปภาพ ตัวอักษร ตาราง เปนตน
 รูปแบบตัวอักษร
<font size = "3"> ขอความ </font> ขนาดตัวอักษร
<font color = "red"> ขอความ </font> สีตัวอักษร
<font face = "Arial"> ขอความ </font> รูปแบบตวอั ักษร
<besefont size = "2"> ขอความ </font> กําหนดคาเร  ิ่มตนของขนาดต  ัวอักษร
<b> ขอความ </b> ตัวอักษรหนา
<i> ขอความ </i> ตัวอักษรเอน
<u> ขอความ </u> ขีดเสนใตตัวอักษร
<tt> ขอความ </tt> ตัวอักษรแบบพมพิ ดีด
หมายเหตุ เราสามารถใชค ําสั่งกําหนดรูปแบบตัวอักษร หลายๆรูปแบบไดเชน
<font face = "Arial" size = "3" color = "red"> ขอความ </font> เปนตน
 จุดเชื่อมโยงขอมูล
<a href ="#news"> Hot News </a> ,
<a name ="news">
กําหนดจดเช ุ ื่อมชื่อ news สวน "a name" คอตื ําแหนงที่
ลิงคไป (เอกสารเดียวกัน)
<a href ="news.html"> Hot News </a> สรางลิงคไปยังเอกสารชื่อ "news.html"
<a href ="http://www.thai.com"> Thai </a> สรางลิงคไปยังเวปไซทอื่น
<a href ="http://www.thai.com" target = "_blank" > Thai </a> สรางลิงคไปยังเวปไซทอื่น และเปดหนาตางใหม  
<a href ="http://www.thai.com"> <img src = "photo.gif"> </a> สรางลิงคโดยใชรูปภาพชื่อ photo.gif เปนตัวเชื่อม
<a href ="mailto:yo@mail.com"> Email </a> สรางลิงคมายังอีเมล
 การแสดงผลแบบรายการแบบมีหมายเลขกํากับ
<OL value = "1" >
 <LI> รายการที่ 1
 <LI> รายการที่ 2
</OL>
การแสดงผลแบบรายการ ใชค ําสั่ง <OL> เปนเริ่มและปดท ายดวย
</OL> สวนคาสํ ั่ง <LI> เปนตําแหนงของรายการที่ตองการ
นําเสนอ เราสามารถกําหนดใหแสดงผลรายการไดหลายแบบเชน
เรียงลําดับ 1,2,3... หรือ I,II,III... หรือ A,B,C,... ไดทั้งนี้จะตอง
เพิ่มคําสั่งเขาไปท <OL value = "A"> ี่ เปนตน







ไม่มีความคิดเห็น:

แสดงความคิดเห็น