ภาษา HTML
HTML (Hyper Text Markup Language) เป็นภาษาที่ใช้ในการเขียนโปรแกรมข้อมูลที่ใช้แสดงผลบนเครือข่าย อินเตอร์เน็ตในลักษณะของข้อความ รูปภาพ เสียง และภาพเคลื่อนไหวต่างๆ ภาษา HTML เป็นภาษาที่ง่ายต่อการเรียนรู้ สามารถกาหนดรูปแบบและ โครงสร้างได้ง่าย และบนั ทึกในรูปของไฟล์นามสกุล .html
โปรแกรมทีใ่ ช้ในการสร้างภาษา HTML - เครื่องมือเขียนคาส่ัง เราจะใชN้ otepad เปน็ หลักเพราะมีเป็นมาตรฐานอยู่ แล้วในวินโดว์ทุกเวอร์ชั่น - เครื่องมือแสดงผล หรือบราวเซอร์นี่ก็มีพร้อมแล้วในวินโดว์ก็เปน็ Internet Explorer, Firefox หรือ google chrome
โครงสร้างหลักของภาษา HTML ในการเขียนภาษา HTML น้ัน จะมีรูปแบบโครงสร้างการเขียนแบ่ง ออกเปน็ 3 ส่วน โดยจะแสดงในรูปแบบของดังนี้ 1. <html> และ </html> ส่วนประกาศเปน็ ส่วนทีก่ าหนดให้ทราบว่า นี่คือภาษา HTML และจะต้องทา การเปิดคาส่ัง <html> และ </html> ปิดโปรแกรม 2. <head></head> ส่วนหัวเรื่องเป็นส่วนทีแ่ สดงผลข้อความบนไตเต้ิลบาร์ 3. <body></body> ส่วนเน้ือหาใส่ข้อมูล ภาพ เสียงและการตกแต่งต่าง ๆ
โครงสรา้ งหลักของภาษา HTML <html> <head><title>ข้อความ</title></head> <body> เน้ือหา รูปภาพ </body> </html>
คาสั่งพืน้ ฐานภาษา HTML 1. คำสัง่ ขึ้นบรรทัดใหม่ <br> นำไว้หน้ำข้อควำม 2. คำส่ังกำหนดขนำดข้อควำมท่ัวไป <font size=“n”>ข้อควำม</font> สำมำรถกำหนดขนำดหน้ำข้อควำมได้ 1-7 ขนำดทีใ่ หญ่ทีส่ ดุ คือ 7 เล็กสดุ 1
คาสงั่ พืน้ ฐานภาษา HTML 3. คำสง่ั กำหนดข้อควำมตัวหนำ <b> นำไว้หน้ำข้อควำม</b> 4. คำส่งั กำหนดข้อควำมตวั เอียง <i>ข้อควำม</i> 5. คำสงั่ กำหนดข้อควำมขีดเส้นใต้ <u>ข้อควำม</u>
คาสัง่ พืน้ ฐานภาษา HTML 6. คำสงั่ จัดตำแหน่งข้อควำม <p align=“a”>ข้อควำม</p> a แทนตำแหน่ง คือ right ขวำ center จัดกลำง left ชิดซ้ำย 7. คำสงั่ เปลี่ยนสีข้อควำม <font color=“#n”>ข้อควำม</font> ค่ำสีจะมีท้งั หมด 6 ตัว ใส่ได้ a-f ตวั เลข 0-9 000000 สีดำ ffffff สีขำว ff0000 สีแดง 00ff00 สีเขียว 0000ff สีน้ำเงิน
คาสง่ั พื้นฐานภาษา HTML 8. คำส่ังสีพ้ืน <bgcolor=“#ค่ำสี”> ใส่ตรงส่วนของแทก็ <body> เป็นกำรกำหนดสีพื้น 9. คำสัง่ กำหนดรปู แบบข้อควำม <font face=“ชื่อข้อควำม”>ข้อควำม</font>
คาส่ังสร้างสรรคข์ อ้ ความ 1. คำส่งั กำหนดข้อควำมวิ่ง <marquee>ข้อควำม </marquee> กำรจัดกำรข้อควำมวิง่ 1.1 กำหนดทิศทำงกำรวิง่ direction direction= left วิง่ จำกขวำไปซ้ำย direction=right วิ่งจำกซ้ำยไปขวำ direction=up วิ่งจำกล่ำงข้ึนบน direction=down วิง่ จำกบนลงล่ำง
คาสงั่ สรา้ งสรรคข์ ้อความ 1.2 กำหนดควำมเร็วข้อควำม scrollamount เช่น <marquee scrollamount=10>ข้อควำม </marquee> 1.3 กำหนดกำรวิง่ ทิศทำงเดียวกนั behavior เช่น <marquee behavior=alternate>ข้อควำม </marquee> 1.4 กำหนดสีพื้นหลังข้อควำมวิ่ง bgcolor เช่น <marquee bgcolor=“#ค่ำสี”>ข้อควำม </marquee>
การแทรกรูปภาพ 1. คำสั่งแทรกรูปภำพ <img src=“ชือ่ โฟรเ์ ดอร์เก็บรูป/ชือ่ รปู .นำมสกลุ ”> ประเภทของนำมสกุลรูปภำพ ประเภทของไฟล์รปู ภำพทีน่ ิยมมำใช้มีอยู่ 3 ประเภท 1. GIF เปน็ ไฟล์ภำพที่ถูกบีบอัดให้มีขนำดเล็ก เหมำะกับกำรแสดงภำพ บนเว็ปในลกั ษณะของภำพทีโ่ ปร่งใสและภำพเคลื่อนไหว
การแทรกรปู ภาพ ประเภทของนำมสกุลรปู ภำพ ประเภทของไฟล์รปู ภำพทีน่ ิยมมำใช้มีอยู่ 3 ประเภท 2. JPEG หรือ JPG เป็นไฟล์รปู ภำพทีน่ ิยมใช้ในกำรรบั ส่งหรือทำเวบ็ มำก ทีส่ ุด โดยเฉพำะภำพถ่ำยที่สำมำรถเก็บควำมละเอียดได้สงู ในขณะที่ขนำดไฟล์ นั้นมีขนำดเลก็ 3. PNG เปน็ รปู แบบไฟล์ภำพที่ถกู คิดค้นเพือ่ มำแทนที่ GIF ทีม่ ีปญั หำเรื่อง ลิขสิทธิ์ ซึ่งคณุ สมบตั รของ PNG นั้นจะคล้ำยกับ GIF ทีส่ ำมำรถทำ background โปร่งแสงได้แถมยังแสดงควำมละเอียดของภำพได้ดีพอกบั .jpg
การแทรกรูปภาพ 2. คำส่ังปรบั ขนำดรูป ควำมกว้ำง <width=“ขนำดรปู ”> ควำมสงู <height=“ขนำดรปู ”> 3. แทรกรปู ภำพพื้นหลัง <background=“ชื่อโฟร์เดอร์เกบ็ รูป/ชือ่ รูป.นำสกลุ ” > จะแทรกไว้แทก็ เดียวกนั กับ <body>
การสร้างตาราง โครงสรา้ งของตาราง คาสงั่ ในการสร้างตาราง <table> ... </table> คาส่ังในการกาหนดแถวของตาราง (แนวนอน) คาสัง่ ในการกาหนดส่วนของคอลมั น์ (แนวต้ัง) <tr> ... </tr> <td> ... </td> แถวที่ 1 แถวที่ ๒ คอลัมน์ 1 คอลมั น์ ๒
สรา้ งของตาราง จะไดต้ าราง 2 แถว 2 คอลมั น์ รูปแบบโครงสรา้ งตาราง <table border=1> <tr> <td>แถวท่ี 1 คอลัมน์ท่ี 1</td> <td>แถวท่ี 1 คอลัมน์ท่ี 2</td> </tr> </table>
การจดั ลกั ษณะพิเศษให้กบั ตาราง border เส้นขอบตาราง bordercolor=“ค่าสี” สีเส้นของตาราง Width = %ค่าความกว้าง Height = % ค่าความสงู
การสรา้ งการเชือ่ มโยง การสรา้ งการเชื่อมโยงสามารถทาได้หลายวิธีดังนี้ 1.การเชื่อมโยงภายในหน้าเว็บเพจเดียวกัน 2.การเชื่อมโยงไปยังหน้าเวบ็ เพจอืน่ ๆ 3.การเชื่อมโยงไปยังเว็บไซต์อื่น ๆ 4.การเชือ่ มโยงไปยังแฟ้มข้อมลู ประเภทต่าง ๆ 5.การเชือ่ มโยงเพือ่ ส่งจดหมายอิเลก็ ทรอนิกส์
การสรา้ งการเชือ่ มโยง 1.การเชื่อมโยงภายในหน้าเว็บเพจเดียวกนั 2.การเชือ่ มโยงไปยงั หน้าเว็บเพจอืน่ ๆ <a href=\"ชือ่ ไฟล์เวบ็ เพจ.นามสกลุ \">ข้อความ</a> 3.กำรเชื่อมโยงไปยงั เวบ็ ไซต์อืน่ ๆ <a href=\"URLหรือที่อย่ขู องเวบ็ ไซต์\">ข้อควำม</a> เช่น <a href=“http:://www.google.co.th”>ขอ้ ความ</a>
Search
Read the Text Version
- 1 - 19
Pages:
