Important Announcement
PubHTML5 Scheduled Server Maintenance on (GMT) Sunday, June 26th, 2:00 am - 8:00 am.
PubHTML5 site will be inoperative during the times indicated!

Home Explore บทที่ 3 คำสั่งพื้นฐานในการสร้างเว็บเพจHTML

บทที่ 3 คำสั่งพื้นฐานในการสร้างเว็บเพจHTML

Published by Anurut Wetchakama, 2021-03-20 18:07:38

Description: บทที่ 3 คำสั่งพื้นฐานในการสร้างเว็บเพจHTML

Search

Read the Text Version

บทที่ 3 คำส่ังพน้ื ฐานในการสรา้ งเว็บเพจHTML การตดั คำขนึ้ บรรทัดใหม่<br> คำสง่ั <br> เปน็ คำส่งั ขึน้ บรรทดั ใหมโ่ ดยตวั คำส่ังจะใช้เพียงตัวเดียวไมต่ อ้ งใช้ 2 ตวั เหมือนคำส่งั อื่น อยู่ภายในคำสั่ง เรียนร้แู ทก็ ตำแหนง่ แท็ก : อย่ภู ายใน <body>…….</body> รูปแบบการใช:้ <br> ข้อความท่ีตอ้ งการขึ้นบรรทัดใหม่ ตามตวั อยา่ ง code ดังนี้ จะไดผ้ ลดงั นี้

ตาม code ในสว่ นที่ 1 เป็นการพิมพข์ ้อความต่อเน่ืองกันแบบธรรมดา ในส่วนท่ี 2 เปน็ แบบใชค้ ำส่ัง <br> ค่นั ระหว่างข้อความเพื่อตอ้ งการให้ขอ้ ความขึน้ บรรทัดใหม่ หากพมิ พ์คำสัง่ <br><br> จะทำให้ข้อความ ข้ึนยอ่ หน้าใหม่ ผลของสว่ นท่ี 1 ผลของส่วนที่ 2 การตัดคำขึน้ ยอ่ หน้าใหม่ <p> คำสั่ง <p> เป็นคำสั่งที่ใช้สำหรับจัดวางตำแหน่งข้อความ (Paragraph Break หรือ Alignment) แม้ จะมี การใช้คำสั่ง ช่วยในการจัดข้อความขึ้นบรรทัดใหม่แล้วบางครั้งยังไม่ตรงตามรูปแบบที่ผู้เขียนโปรแกรม ต้องการ เช่น จัดขึ้นบรรทัดใหมแ่ ละเว้นบรรทัด หรือจัดย่อหนา้ จัดข้อความชิดซ้าย จัดข้อความให้อยูก่ ึ่งกลาง ในโปรแกรม HTML สามารถทำได้โดยใช้รปู แบบคำสง่ั ดังนี้

เรยี นรู้แท็ก ตำแหน่งแท็ก : อยูภ่ ายใน <body>…….</body> รปู แบบการใช:้ <p>…….</p> ตวั อย่างการใช้ <p> <body> ประวัติความเปน็ มาอินเทอร์เนต็ <br> <p> อนิ เทอรเ์ นต็ ซงึ่ เป็นโครงการของ ARPAnet(Advanced Research Projects Agency Network) ซง่ึ เปน็ หน่วยงานท่สี ังกัดกระทรวงกลาโหม ของสหรัฐ (U.S.Department of Defense - DoD) ถกู ก่อตั้ง เม่อื ประมาณ ปคี .ศ.1960(พ.ศ.2503)และได้ถกู พัฒนาเรื่อยมา <p> <p> ค.ศ.1969(พ.ศ.2512) ARPA ไดร้ ับทนุ สนนั สนนุ จากหลายฝ่าย ซึ่งหน่งึ ในผูส้ นับสนนุ กค็ ือ Edward Kenedy และเปลี่ยนชอ่ื จาก ARPA เป็น DARPA(Defense Advanced Research Projects Agency) พร้อมเปลย่ี นแปลงนโยบายบางอยา่ ง และในปคี .ศ.1969(พ.ศ.2512)นเี้ องทไ่ี ด้ ทดลองการเชื่อมตอ่ คอมพิวเตอรค์ นละชนิด จาก 4 แห่ง เขา้ หากันเป็นครัง้ แรก คอื มหาวทิ ยาลัย แคลฟิ อร์เนยี สถาบนั วจิ ยั สแตนฟอรด์ มหาวทิ ยาลยั แคลิฟอรเ์ นยี และมหาวิทยาลัยยูทาห์ เครอื ขา่ ยทดลองประสบความสำเร็จอยา่ งมาก ดังน้นั ในปีค.ศ.1975(พ.ศ.2518)จงึ ไดเ้ ปลยี่ นจาก เครือข่ายทดลอง เป็นเครือข่ายทีใ่ ช้งานจริง <p> <body> ผลลพั ทท์ ี่ได้

การจดั ตำแหนง่ ข้อความภายในย่อหนา้ ด้วย align Align เปน็ แอททรบิ วิ ท์ เพ่ือใช้จัดตำแหนง่ ขอ้ ความภายในย่อหน้า ตามตำแหน่งทีเ่ ราต้องการ โดยมีรปู แบบ ดงั ตอ่ ไปนี้ เรียนรแู้ ท็ก ตำแหนง่ แทก็ : อย่ภู ายในแท็กเปิด <p> รปู แบบการใช้: <p align=”ตำแหนง่ ”> …</p> ตำแหน่งท่ใี ช้: left คอื ชดิ ซ้าย right คือ ชดิ ขวา center คือ กึ่งกลาง ตวั อย่างการใช้ <align> <body> <p align=left> ตัวอย่างข้อความท่ถี กู จัดด้วยคำสัง่ left <p> <p align=center> ตัวอย่างขอ้ ความท่ีถูกจัดดว้ ยคำส่ัง center <p> <p align=right> ตัวอยา่ งขอ้ ความท่ถี กู จัดด้วยคำสัง่ right <p> <body> ผลลัพท์ท่ีได้

เพิม่ ชอ่ งว่างข้อความด้วย &nbsp; ถา้ เราตอ้ งการเว้นชอ่ งวา่ งระหว่างขอ้ ความ สามารถทำได้ด้วยการแทรกอักขระพิเศษลงไปคือ แทน 1 ชุด ต่อ1 ชอ่ งว่างตัวอักษร โดยมีรูปแบบดังน้ี เรยี นรแู้ ทก็ ตำแหนง่ แทก็ : อยูภ่ ายใน <body>…….</body> รปู แบบการใช้: ใส่ &nbsp; ตรงตำแหนง่ ท่ตี อ้ งการเวน้ ช่องวา่ งมากกวา่ 1ช่องว่าง ตวั อยา่ งการใช้ &nbsp <body> ประวตั คิ วามเปน็ มาอินเทอร์เน็ต <br> <p> &nbsp&nbsp&nbsp;&nbsp;&nbsp;อินเทอร์เน็ต ซ่ึงเป็นโครงการของ ARPAnet ซ่ึงเป็นหนว่ ยงาน ทสี่ ังกัด กระทรวงกลาโหม ของสหรัฐ ถกู ก่อต้งั เม่ือประมาณ ปีค.ศ.1960(พ.ศ.2503) และไดถ้ ูกพัฒนาเรือ่ ยมา </p> <p align=right> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ค.ศ.1969 ARPA ได้รบั ทุนสนนั สนนุ จากหลายฝา่ ย ซง่ึ หนง่ึ ในผู้สนบั สนนุ ก็คือ Edward Kenedy และเปล่ียนชอื่ จาก ARPA เปน็ DARPA พร้อมเปล่ยี นแปลง นโยบายบางอย่าง </p> <body> ผลลัพท์ทไ่ี ด้

การจดั วางตำแหนง่ ข้อความใหอ้ ยกู่ ่ึงกลางด้วย <center> center เปน็ แท็กคำสง่ั ท่ีใชจ้ ัดก่ึงกลางเน้ือหาบนหน้าเว็บเพจไมว่ ่าจะเปน็ ขอ้ ความ รปู ภาพ ตาราง แตใ่ นหนว่ ยนจ่ี ะขอกล่าวถึงเฉพาะการจัดก่งึ กลางข้อความ เรียนรูแ้ ทก็ ตำแหน่งแท็ก : อยภู่ ายใน <body>…….</body> รูปแบบการใช:้ <center> …</center> ตวั อยา่ งการใช้ <center> <body> <h3> <center> ประวตั ิส่วนตัว </center> </h3> <br> ช่ือ <br> ช้ัน <br> เลขท่ี <br> <center> ที่อยู่ <br> ความสามารถพเิ ศษ <br> </center> <body> ผลลัพท์ทไ่ี ด้

การจัดรูปแบบเอกสารด้วย <pre> center เปน็ แท็กคำส่ังท่ีใช้จัดก่ึงกลางเนื้อหาบนหนา้ เว็บเพจไม่ว่าจะเปน็ ข้อความ รูปภาพ ตาราง แต่ ในหน่วยนจ่ี ะขอกลา่ วถงึ เฉพาะการจดั กึง่ กลางข้อความ เรียนรู้แท็ก ตำแหน่งแทก็ : อยภู่ ายใน <body>…….</body> รูปแบบการใช้: <pre> …</pre> ตวั อยา่ งการใช้ <pre> <body> <pre> ประวัติ บิลล์ เกตส์ เจา้ พ่อแหง่ Microsoft เกดิ 28 ตลุ าคม ค.ศ. 1955 อายุ 43 สญั ชาตอิ เมริกัน สถานะแตง่ งาน ลกู 2 สถานศกึ ษา มหาวิทยาลัยฮาร์วาร์ด มเี งิน 9 หมนื่ ลา้ นดอลลา่ ร์สหรัฐในประวตั ิ บิลล์ เกตส์นน้ั เขาได้เข้าศกึ ษาที่ โรงเรียนเลคไซด์ อันเป็นโรงเรียนมธั ยมท่ดี ีที่สุดในเมืองซีแอทเทิล ทีน่ ั่นเองที่เขาได้พัฒนาทักษะในการ เขยี นโปรแกรมคอมพวิ เตอร์กบั เครอื่ งมินคิ อมพิวเตอร์ของโรงเรียน เพ่อื ให้ไดเ้ ครือ่ งคอมพิวเตอร์ที่มีประสิทธภิ าพดีกว่าเดมิ บิลล์ เกตส์ กบั พอล อัลเลน เพ่ือนสนิท ไดแ้ อบยอ่ งเข้าไปในหอ้ งปฏิบตั กิ ารคอมพิวเตอร์ของมหาวิทยาลัยวอชิงตันท้งั คถู่ ูกจับไดแ้ ต่กไ็ ดเ้ จรจาตก ลงกบั เจ้าหน้าที่ห้องปฏิบัตกิ าร เพ่ือชว่ ยจัดหาเคร่อื งคอมพิวเตอร์ให้กับนักเรยี นไดใ้ ช้ฟรี ตอ่ มาบิลล์ เกตสไ์ ดเ้ ข้าศึกษาที่มหาวิทยาลยั ฮารว์ ารด์ แตต่ อ้ งพกั การเรียนไปโดยไมจ่ บการศึกษา เพ่ือทจ่ี ะได้เรม่ิ ประกอบอาชพี ทางดา้ นการพฒั นาซอฟตแ์ วร์ ในระหวา่ งที่กำลงั ศึกษาอยู่ที่ฮาร์ วารด์ เขามีโอกาสได้ทำความร้จู กั กบั สตีฟบาลเมอร์ หนง่ึ ในผรู้ ว่ มก่อต้ังบริษัทไมโครซอฟท์ ทั้งค่เู ปน็ เพื่อนรว่ มหอ้ งในหอพักระหวา่ งเปน็ นกั ศกึ ษาปี 1 </pre> <body> ผลลัพท์ทีไ่ ด้

สร้างเสน้ คน่ั แนวนอน <hr> การสร้างเส้นคัน่ แนวนอน (Horizontal Line) เพือ่ แยกเอกสารออกเปน็ ส่วน ๆ ทำให้งา่ ยต่อการอ่าน และดเู ป็นระเบยี บมากยงิ่ ข้ึน โดยมรี ปู แบบการใชค้ ำสั่ง ดังนี้ เรยี นรู้แท็ก ตำแหนง่ แท็ก : อยูภ่ ายใน <body>…….</body> รปู แบบการใช้: <hr> ตัวอยา่ งการใช้ <hr> <body> ประวตั คิ วามเป็นมาอินเทอรเ์ นต็ <br> <p> อนิ เทอร์เนต็ ซ่งึ เป็นโครงการของ ARPAnet(Advanced Research Projects Agency Network) ซง่ึ เป็นหน่วยงานทีส่ งั กัด กระทรวงกลาโหม ของสหรฐั </p> <hr> <p> ค.ศ.1969(พ.ศ.2512) ARPA ไดร้ ับทุนสนันสนุน จากหลายฝา่ ย ซ่งึ หนึ่งในผู้สนับสนุนก็คือ Edward Kenedy และเปลี่ยนช่ือจาก ARPA เปน็ DARPA(Defense Advanced Research Projects Agency) </p> <body>

ผลลัพท์ท่ไี ด้ เพิ่มหมายเหตเุ ตอื นความจำ <!--..--> การสรา้ งเสน้ คั่นแนวนอน (Horizontal Line) เพือ่ แยกเอกสารออกเป็นสว่ น ๆ ทำให้งา่ ยตอ่ การอา่ น และดูเปน็ ระเบยี บมากย่ิงข้นึ โดยมีรูปแบบการใชค้ ำสัง่ ดงั นี้ เรยี นรูแ้ ทก็ เรยี นรแู้ ท็ก ตำแหนง่ แท็ก : วางอยใู่ นตำแหน่งใดกไ็ ด้ในโปรแกรม รปู แบบการใช้: <!--..--> ตัวอย่างการใช้ <!--..--> <body> <!--น่ีคือจดุ เร่มิ ตน้ ส่วนแสดงผล--> ข้อมูล <br> ขอ้ มลู <br> ขอ้ มลู <br> <body> <!--น่คี อื จดุ สน้ิ สุดส่วนแสดงผล-->

ผลลพั ท์ท่ไี ด้


Like this book? You can publish your book online for free in a few minutes!
Create your own flipbook