SlideShare a Scribd company logo
1 of 4
บทนำ 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

More Related Content

Viewers also liked

Presentation of draft efyp to mo af
Presentation of draft efyp to mo afPresentation of draft efyp to mo af
Presentation of draft efyp to mo afdawa609
 
методы повышения
методы повышенияметоды повышения
методы повышенияNadin Shorokhova
 
3.คำสั่งในการจัดหน้า
3.คำสั่งในการจัดหน้า3.คำสั่งในการจัดหน้า
3.คำสั่งในการจัดหน้าbimteach
 
The School of Fashion Move Downtown: What Should I Save for the Archives?
The School of Fashion Move Downtown: What Should I Save for the Archives?The School of Fashion Move Downtown: What Should I Save for the Archives?
The School of Fashion Move Downtown: What Should I Save for the Archives?tnslibrariesandarchives
 
Blog et journaliste, la grande incompréhension
Blog et journaliste, la grande incompréhensionBlog et journaliste, la grande incompréhension
Blog et journaliste, la grande incompréhensionCedric Motte
 
6.แบ่งหน้าจอโดยใช้ frame html
6.แบ่งหน้าจอโดยใช้ frame html6.แบ่งหน้าจอโดยใช้ frame html
6.แบ่งหน้าจอโดยใช้ frame htmlbimteach
 
доклад на конференции. малофеев фёдор
доклад на конференции. малофеев фёдордоклад на конференции. малофеев фёдор
доклад на конференции. малофеев фёдорNadin Shorokhova
 
Wireless and WLAN Secuirty, Presented by Vijay
Wireless and WLAN Secuirty, Presented by VijayWireless and WLAN Secuirty, Presented by Vijay
Wireless and WLAN Secuirty, Presented by Vijaythevijayps
 
Empathy roadmap v1
Empathy roadmap v1Empathy roadmap v1
Empathy roadmap v1Mark Fulara
 
A donde iré sin ti señor (2)
A donde iré sin ti señor (2)A donde iré sin ti señor (2)
A donde iré sin ti señor (2)talleresnacy
 
Staging presentation for_prezi
Staging presentation for_preziStaging presentation for_prezi
Staging presentation for_preziRobin Leigh
 

Viewers also liked (16)

.3
 .3  .3
.3
 
Feliz navidad
Feliz navidadFeliz navidad
Feliz navidad
 
Presentation of draft efyp to mo af
Presentation of draft efyp to mo afPresentation of draft efyp to mo af
Presentation of draft efyp to mo af
 
методы повышения
методы повышенияметоды повышения
методы повышения
 
3.คำสั่งในการจัดหน้า
3.คำสั่งในการจัดหน้า3.คำสั่งในการจัดหน้า
3.คำสั่งในการจัดหน้า
 
The School of Fashion Move Downtown: What Should I Save for the Archives?
The School of Fashion Move Downtown: What Should I Save for the Archives?The School of Fashion Move Downtown: What Should I Save for the Archives?
The School of Fashion Move Downtown: What Should I Save for the Archives?
 
Blog et journaliste, la grande incompréhension
Blog et journaliste, la grande incompréhensionBlog et journaliste, la grande incompréhension
Blog et journaliste, la grande incompréhension
 
6.แบ่งหน้าจอโดยใช้ frame html
6.แบ่งหน้าจอโดยใช้ frame html6.แบ่งหน้าจอโดยใช้ frame html
6.แบ่งหน้าจอโดยใช้ frame html
 
доклад на конференции. малофеев фёдор
доклад на конференции. малофеев фёдордоклад на конференции. малофеев фёдор
доклад на конференции. малофеев фёдор
 
Presentation2
Presentation2Presentation2
Presentation2
 
Wireless and WLAN Secuirty, Presented by Vijay
Wireless and WLAN Secuirty, Presented by VijayWireless and WLAN Secuirty, Presented by Vijay
Wireless and WLAN Secuirty, Presented by Vijay
 
Empathy roadmap v1
Empathy roadmap v1Empathy roadmap v1
Empathy roadmap v1
 
A donde iré sin ti señor (2)
A donde iré sin ti señor (2)A donde iré sin ti señor (2)
A donde iré sin ti señor (2)
 
Time Series Momentum
Time Series MomentumTime Series Momentum
Time Series Momentum
 
Staging presentation for_prezi
Staging presentation for_preziStaging presentation for_prezi
Staging presentation for_prezi
 
Rice color sorter
Rice color sorterRice color sorter
Rice color sorter
 

Similar to 1.บทนำ html

ใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtmlใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtmlSamorn Tara
 
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtmlใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtmlSamorn Tara
 
ประวัต Html
ประวัต Htmlประวัต Html
ประวัต Htmlkrurit9
 
บทที่ 3 พื้นฐานภาษาสำหรับพัฒนาเว็บไซต์
บทที่ 3 พื้นฐานภาษาสำหรับพัฒนาเว็บไซต์บทที่ 3 พื้นฐานภาษาสำหรับพัฒนาเว็บไซต์
บทที่ 3 พื้นฐานภาษาสำหรับพัฒนาเว็บไซต์chiton2535
 
การสร้างเว็บเพจด้วยภาษา Html
การสร้างเว็บเพจด้วยภาษา Htmlการสร้างเว็บเพจด้วยภาษา Html
การสร้างเว็บเพจด้วยภาษา HtmlFair Kung Nattaput
 
2.เริ่มต้นกับ xhtml และ xhtml
2.เริ่มต้นกับ xhtml และ xhtml2.เริ่มต้นกับ xhtml และ xhtml
2.เริ่มต้นกับ xhtml และ xhtmlBeerza Kub
 
รู้จักกับ Html(แก้ไข)
รู้จักกับ Html(แก้ไข)รู้จักกับ Html(แก้ไข)
รู้จักกับ Html(แก้ไข)Beerza Kub
 
หน่วยการเรียนรู้ที่ 3 html
หน่วยการเรียนรู้ที่ 3 htmlหน่วยการเรียนรู้ที่ 3 html
หน่วยการเรียนรู้ที่ 3 htmldevilp Nnop
 
ใบงานที่ 1
ใบงานที่ 1ใบงานที่ 1
ใบงานที่ 1Poppy Love
 
ใบงานที่ 1
ใบงานที่ 1ใบงานที่ 1
ใบงานที่ 1Poppy Love
 
ใบงานที่ 1
ใบงานที่ 1ใบงานที่ 1
ใบงานที่ 1Poppy Love
 
เนื้อหา Html
เนื้อหา Htmlเนื้อหา Html
เนื้อหา HtmlRungnapha Naka
 
Session1 part2
Session1 part2Session1 part2
Session1 part2maovkh
 

Similar to 1.บทนำ html (19)

Html
HtmlHtml
Html
 
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtmlใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
 
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtmlใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
 
ประวัต Html
ประวัต Htmlประวัต Html
ประวัต Html
 
บทที่ 3 พื้นฐานภาษาสำหรับพัฒนาเว็บไซต์
บทที่ 3 พื้นฐานภาษาสำหรับพัฒนาเว็บไซต์บทที่ 3 พื้นฐานภาษาสำหรับพัฒนาเว็บไซต์
บทที่ 3 พื้นฐานภาษาสำหรับพัฒนาเว็บไซต์
 
การสร้างเว็บเพจด้วยภาษา Html
การสร้างเว็บเพจด้วยภาษา Htmlการสร้างเว็บเพจด้วยภาษา Html
การสร้างเว็บเพจด้วยภาษา Html
 
Html 2
Html 2Html 2
Html 2
 
08 W3 Browser
08 W3 Browser08 W3 Browser
08 W3 Browser
 
2.เริ่มต้นกับ xhtml และ xhtml
2.เริ่มต้นกับ xhtml และ xhtml2.เริ่มต้นกับ xhtml และ xhtml
2.เริ่มต้นกับ xhtml และ xhtml
 
รู้จักกับ Html(แก้ไข)
รู้จักกับ Html(แก้ไข)รู้จักกับ Html(แก้ไข)
รู้จักกับ Html(แก้ไข)
 
หน่วยการเรียนรู้ที่ 3 html
หน่วยการเรียนรู้ที่ 3 htmlหน่วยการเรียนรู้ที่ 3 html
หน่วยการเรียนรู้ที่ 3 html
 
Pai02
Pai02Pai02
Pai02
 
Education
EducationEducation
Education
 
ใบงานที่ 1
ใบงานที่ 1ใบงานที่ 1
ใบงานที่ 1
 
ใบงานที่ 1
ใบงานที่ 1ใบงานที่ 1
ใบงานที่ 1
 
ใบงานที่ 1
ใบงานที่ 1ใบงานที่ 1
ใบงานที่ 1
 
เนื้อหา Html
เนื้อหา Htmlเนื้อหา Html
เนื้อหา Html
 
Lernning 13
Lernning 13Lernning 13
Lernning 13
 
Session1 part2
Session1 part2Session1 part2
Session1 part2
 

1.บทนำ html

  • 1. บทนำ HTML HTML ต้นกำเนิดของภำษำ HTML เกิดจำก เมื่อปี 1989 นักฟิสิกส์ชื่อ Tim Berners-Lee แห่งสถำบันวิจัย CERN เสนองำนวิจัยเรื่อง prototyped ENQUIRE และ Hypertext system ใช้สำหรับนักวิจัยของสถำบันเพื่อแบ่งข้อมูลกัน และถูกพัฒนำมำเรื่อยๆจนถึงปัจจุบัน HTML เป็นตัวย่อมำจำก Hypertext Markup Language เป็นภำษำหลักที่ใช้ในกำรแสดงผลบนเว็บ บรำวเซอร์ในอินเตอร์ โดยสำมำรถนำเสนอข้อมูลตัวอักษร รวมทั้งเชื่อมต่อเพื่อ แสดงภำพ , เสียง และไฟล์ในรูปแบบอื่นๆ ภำษำ HTML จะแบ่งออกเป็น 2 ส่วน คือ 1. ส่วนของคำสั่ง (tag) เป็นส่วนที่กำหนดรูปแบบของข้อควำมที่แสดง ซึ่งเรำเรียกว่ำ Tag โดยจะอยู่ในเครื่องหมำย < ... > 2. ส่วนของบทควำมทั่วๆไป เป็นส่วนของข้อควำมที่เรำต้อง กำรแสดงผล
  • 2. ตัวอย่ำงกำรใช้งำนภำษำ HTML คุณอำจลองพิมพ์ตำมตัวอักษรด้ำนล่ำงนี้ ใน Text editer ของคุณเช่น Notepad <html> <head> <title> หัวข้อเรื่อง ของหน้ำนี้ </title> </head> <body> เนื้อหำที่จะแสดงใน web browser </body> </html>
  • 3. เมื่อคุณพิมพ์เสร็จก็ให้ save ในชื่อ mypage.html และลองใช้ web browser อย่ำง internet explorer หรือ fire fox เปิดดูก็จะเห็นผลตำมรูปด้ำนล่ำง กำรทำงำนของ code ด้ำนบน 1. <html> ...... </html> ในกำรใช้งำน HTML เรำจะต้องเริ่มด้วย <html> และปิดด้วย </html> เสมอ 2. <head> ...... </head> เป็นส่วนที่ใช้ให้รำยละเอียดเกี่ยวกับ
  • 4. เว็บเพจหน้ำนี้ ซึ่งจะไม่แสดงให้เห็นในส่วนของกำรแสดงผลของ web browser แต่จะมีผลกับส่วนอื่นๆ เช่น กำรหำของ search engine (google,yahoo) กำรใช้งำนก็จะมีคำสั่งย่อยเพื่อบรรยำยรำยละเอียด เช่น <title> .... </title> , <meta> และอื่นอีกมำกมำย 3. <title> .......... </title> ในส่วนตัวอักษรที่อยู่ในคำสั่งนี้จะอยู่ใน title bar ของ web page 4. <body> .......... </body> ตัวอักษรที่อยู่ในคำสั่งนี้จะแสดงส่วนแสดงผลข อง web browser