SlideShare a Scribd company logo
1 of 6
HTML Intro
duction
เรียบเรียงโดย ชายดาคอมพิวเตอร์
What is HTML?
 HTML คืออะไร ?
HTML เป็นภาษามาร์กอัปสาหรับการอธิบายเอกสารเว็บ (หน้าเว็บ หรือ เว็บ
เพจ).
* HTML ย่อมาจาก Hyper Text Markup Language
* ภาษามาร์กอัปเป็นชุดของแท็กมาร์กอัป
* เอกสาร HTML จะมีการอธิบายโดยการใช้แท็ก
* แต่ละแท็กจะอธิบายเนื้อหาของเอกสารที่แตกต่างกัน
HTML Example
<!DOCTYPE html>
<html>
<head>
<title> Page Title
</title>
</head>
<body>
<h1> My First
Heading </h1>
<p> My first
paragraph. </p>
</body>
</html>
Example Explained
 อธิบายตัวอย่างโค้ดด้านบน
* ประกาศ DOCTYPE กาหนดประเภทเอกสารที่จะเป็น HTML
* ข้อความที่อยู่ระหว่าง <html> และ </ html> อธิบายเอกสาร HTML
* ข้อความที่อยู่ระหว่าง <head> และ </ head> ให้ข้อมูลเกี่ยวกับเอกสาร
* ข้อความที่อยู่ระหว่าง <title> และ </ title> ให้ชื่อของเอกสาร
* ข้อความที่อยู่ระหว่าง <body> และ </ body> อธิบายเนื้อหาของหน้าเว็บ
ที่มองเห็นได้
* ข้อความที่อยู่ระหว่าง <h1> และ </ h1> อธิบายหัวข้อ
* ข้อความที่อยู่ระหว่าง <p> และ </ p> อธิบายวรรค
!--- การใช้คาอธิบายนี้ เว็บเบราเซอร์สามารถแสดงข้อความที่มีในส่วน heading
และ paragraph
Web Browsers
 ผลลัพธ์ ในเว็บ
บราวเซอร์
HTML Page Structure
 โครงสร้าง
HTML

More Related Content

Viewers also liked

How-To Buy Your Blogs Website Nourish Classified By Google ! Along With Live ...
How-To Buy Your Blogs Website Nourish Classified By Google ! Along With Live ...How-To Buy Your Blogs Website Nourish Classified By Google ! Along With Live ...
How-To Buy Your Blogs Website Nourish Classified By Google ! Along With Live ...
Alfulthe847
 
บทที่ 1 ทำความรู้จักเว็บเพจ
บทที่ 1 ทำความรู้จักเว็บเพจบทที่ 1 ทำความรู้จักเว็บเพจ
บทที่ 1 ทำความรู้จักเว็บเพจ
Nattipong Siangyen
 
Rpppaismp kelas vii
Rpppaismp kelas viiRpppaismp kelas vii
Rpppaismp kelas vii
aldin05
 
News May 4-10
News May 4-10News May 4-10
News May 4-10
nuthorn
 
News June 1-7
News June 1-7 News June 1-7
News June 1-7
nuthorn
 
เฟียเจท์ 1
เฟียเจท์ 1เฟียเจท์ 1
เฟียเจท์ 1
pattamasatun
 

Viewers also liked (17)

Vacuum Switch MZ Series
Vacuum Switch MZ SeriesVacuum Switch MZ Series
Vacuum Switch MZ Series
 
Dioses egipcios6
Dioses egipcios6Dioses egipcios6
Dioses egipcios6
 
Bar stock with lag threaded end thermowell
Bar stock with lag threaded end thermowellBar stock with lag threaded end thermowell
Bar stock with lag threaded end thermowell
 
How-To Buy Your Blogs Website Nourish Classified By Google ! Along With Live ...
How-To Buy Your Blogs Website Nourish Classified By Google ! Along With Live ...How-To Buy Your Blogs Website Nourish Classified By Google ! Along With Live ...
How-To Buy Your Blogs Website Nourish Classified By Google ! Along With Live ...
 
Hizb 57
Hizb 57Hizb 57
Hizb 57
 
Ppt..ap (1)
Ppt..ap (1)Ppt..ap (1)
Ppt..ap (1)
 
บทที่ 1 ทำความรู้จักเว็บเพจ
บทที่ 1 ทำความรู้จักเว็บเพจบทที่ 1 ทำความรู้จักเว็บเพจ
บทที่ 1 ทำความรู้จักเว็บเพจ
 
Alfama &amp; Epiphany Collection
Alfama &amp; Epiphany CollectionAlfama &amp; Epiphany Collection
Alfama &amp; Epiphany Collection
 
Rpppaismp kelas vii
Rpppaismp kelas viiRpppaismp kelas vii
Rpppaismp kelas vii
 
01 ข้อมูลและสารสนเทศ
01 ข้อมูลและสารสนเทศ01 ข้อมูลและสารสนเทศ
01 ข้อมูลและสารสนเทศ
 
News May 4-10
News May 4-10News May 4-10
News May 4-10
 
News June 1-7
News June 1-7 News June 1-7
News June 1-7
 
Hendawy ragabb cv update 21 6 2015
Hendawy ragabb cv update 21   6   2015Hendawy ragabb cv update 21   6   2015
Hendawy ragabb cv update 21 6 2015
 
Why to use bing adcenter
Why to use bing adcenterWhy to use bing adcenter
Why to use bing adcenter
 
Hizb 50
Hizb 50Hizb 50
Hizb 50
 
Stp1
Stp1Stp1
Stp1
 
เฟียเจท์ 1
เฟียเจท์ 1เฟียเจท์ 1
เฟียเจท์ 1
 

Similar to บทที่ 2 html introduction

หน่วยการเรียนรู้ที่ 3 html
หน่วยการเรียนรู้ที่ 3 htmlหน่วยการเรียนรู้ที่ 3 html
หน่วยการเรียนรู้ที่ 3 html
devilp Nnop
 
Session1 part2
Session1 part2Session1 part2
Session1 part2
maovkh
 
เนื้อหา Html
เนื้อหา Htmlเนื้อหา Html
เนื้อหา Html
Rungnapha Naka
 
การสอนเขียนHtml
การสอนเขียนHtmlการสอนเขียนHtml
การสอนเขียนHtml
chukiat008
 
2.โครงสร้างคำสั่งของ html
2.โครงสร้างคำสั่งของ html2.โครงสร้างคำสั่งของ html
2.โครงสร้างคำสั่งของ html
bimteach
 
ใบความรู้ที่ 2
ใบความรู้ที่ 2ใบความรู้ที่ 2
ใบความรู้ที่ 2
POmp POmpomp
 
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtmlใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
Samorn Tara
 
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtmlใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
Samorn Tara
 
การเขียน Web site ด้วยภาษา html
การเขียน Web site ด้วยภาษา htmlการเขียน Web site ด้วยภาษา html
การเขียน Web site ด้วยภาษา html
Palasut
 
รายงาน
รายงานรายงาน
รายงาน
kongdang
 
รายงาน
รายงานรายงาน
รายงาน
pim1122
 
รายงาน
รายงานรายงาน
รายงาน
pim1122
 
รายงาน เรื่อง css
รายงาน เรื่อง cssรายงาน เรื่อง css
รายงาน เรื่อง css
nongnan
 
รายงาน
รายงานรายงาน
รายงาน
noopim
 
รายงาน
รายงานรายงาน
รายงาน
kongdang
 

Similar to บทที่ 2 html introduction (20)

หน่วยการเรียนรู้ที่ 3 html
หน่วยการเรียนรู้ที่ 3 htmlหน่วยการเรียนรู้ที่ 3 html
หน่วยการเรียนรู้ที่ 3 html
 
Html 2
Html 2Html 2
Html 2
 
Session1 part2
Session1 part2Session1 part2
Session1 part2
 
Pai02
Pai02Pai02
Pai02
 
เริ่มต้นสร้างเอกสาร HTML
เริ่มต้นสร้างเอกสาร HTMLเริ่มต้นสร้างเอกสาร HTML
เริ่มต้นสร้างเอกสาร HTML
 
เนื้อหา Html
เนื้อหา Htmlเนื้อหา Html
เนื้อหา Html
 
Html
HtmlHtml
Html
 
การสอนเขียนHtml
การสอนเขียนHtmlการสอนเขียนHtml
การสอนเขียนHtml
 
2.โครงสร้างคำสั่งของ html
2.โครงสร้างคำสั่งของ html2.โครงสร้างคำสั่งของ html
2.โครงสร้างคำสั่งของ html
 
Lernning 13
Lernning 13Lernning 13
Lernning 13
 
ใบความรู้ที่ 2
ใบความรู้ที่ 2ใบความรู้ที่ 2
ใบความรู้ที่ 2
 
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtmlใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
 
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtmlใบความรู้ที่ 2.3 รู้จักภาษาhtml
ใบความรู้ที่ 2.3 รู้จักภาษาhtml
 
การเขียน Web site ด้วยภาษา html
การเขียน Web site ด้วยภาษา htmlการเขียน Web site ด้วยภาษา html
การเขียน Web site ด้วยภาษา html
 
รายงาน
รายงานรายงาน
รายงาน
 
รายงาน
รายงานรายงาน
รายงาน
 
รายงาน
รายงานรายงาน
รายงาน
 
รายงาน เรื่อง css
รายงาน เรื่อง cssรายงาน เรื่อง css
รายงาน เรื่อง css
 
รายงาน
รายงานรายงาน
รายงาน
 
รายงาน
รายงานรายงาน
รายงาน
 

More from Nattipong Siangyen

More from Nattipong Siangyen (20)

บทที่ 2 ประเภทของคอมพิวเตอร์ (ตามราคาและความเร็ว)
บทที่ 2 ประเภทของคอมพิวเตอร์ (ตามราคาและความเร็ว)บทที่ 2 ประเภทของคอมพิวเตอร์ (ตามราคาและความเร็ว)
บทที่ 2 ประเภทของคอมพิวเตอร์ (ตามราคาและความเร็ว)
 
บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์
บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์
บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์
 
บทที่ 2 ประเภทของคอมพิวเตอร์ (ตามราคาและความเร็ว)
บทที่ 2 ประเภทของคอมพิวเตอร์ (ตามราคาและความเร็ว)บทที่ 2 ประเภทของคอมพิวเตอร์ (ตามราคาและความเร็ว)
บทที่ 2 ประเภทของคอมพิวเตอร์ (ตามราคาและความเร็ว)
 
บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์
บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์
บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์
 
คำสั่ง Sql เบื้องต้น(delete)
คำสั่ง Sql เบื้องต้น(delete)คำสั่ง Sql เบื้องต้น(delete)
คำสั่ง Sql เบื้องต้น(delete)
 
คำสั่ง Sql เบื้องต้น(update)
คำสั่ง Sql เบื้องต้น(update)คำสั่ง Sql เบื้องต้น(update)
คำสั่ง Sql เบื้องต้น(update)
 
คำสั่ง Sql เบื้องต้น(select)
คำสั่ง Sql เบื้องต้น(select)คำสั่ง Sql เบื้องต้น(select)
คำสั่ง Sql เบื้องต้น(select)
 
คำสั่ง Sql เบื้องต้น(insert into)
คำสั่ง Sql เบื้องต้น(insert into)คำสั่ง Sql เบื้องต้น(insert into)
คำสั่ง Sql เบื้องต้น(insert into)
 
คำสั่ง Sql เบื้องต้น(create table)
คำสั่ง Sql เบื้องต้น(create table)คำสั่ง Sql เบื้องต้น(create table)
คำสั่ง Sql เบื้องต้น(create table)
 
คำสั่ง Sql เบื้องต้น(create db)
คำสั่ง Sql เบื้องต้น(create db)คำสั่ง Sql เบื้องต้น(create db)
คำสั่ง Sql เบื้องต้น(create db)
 
09 ชนิดข้อมูล
09 ชนิดข้อมูล09 ชนิดข้อมูล
09 ชนิดข้อมูล
 
07 e r model
07 e r model07 e r model
07 e r model
 
06 แบบจำลองฐานข้อมูลเชิงสัมพันธ์
06 แบบจำลองฐานข้อมูลเชิงสัมพันธ์06 แบบจำลองฐานข้อมูลเชิงสัมพันธ์
06 แบบจำลองฐานข้อมูลเชิงสัมพันธ์
 
05 ภาษาที่ใช้ในระบบการจัดการฐานข้อมูล
05 ภาษาที่ใช้ในระบบการจัดการฐานข้อมูล05 ภาษาที่ใช้ในระบบการจัดการฐานข้อมูล
05 ภาษาที่ใช้ในระบบการจัดการฐานข้อมูล
 
03 ชนิดของความสัมพันธ์
03 ชนิดของความสัมพันธ์03 ชนิดของความสัมพันธ์
03 ชนิดของความสัมพันธ์
 
02 ความรู้เบื้องต้นฐานข้อมูล
02 ความรู้เบื้องต้นฐานข้อมูล02 ความรู้เบื้องต้นฐานข้อมูล
02 ความรู้เบื้องต้นฐานข้อมูล
 
01ข้อมูลและสารสนเทศ
01ข้อมูลและสารสนเทศ01ข้อมูลและสารสนเทศ
01ข้อมูลและสารสนเทศ
 
10 กรณีศึกษา
10 กรณีศึกษา10 กรณีศึกษา
10 กรณีศึกษา
 
อ้างอิง
อ้างอิงอ้างอิง
อ้างอิง
 
02 การทำโครงงานอย่างง่าย
02 การทำโครงงานอย่างง่าย02 การทำโครงงานอย่างง่าย
02 การทำโครงงานอย่างง่าย
 

บทที่ 2 html introduction

  • 2. What is HTML?  HTML คืออะไร ? HTML เป็นภาษามาร์กอัปสาหรับการอธิบายเอกสารเว็บ (หน้าเว็บ หรือ เว็บ เพจ). * HTML ย่อมาจาก Hyper Text Markup Language * ภาษามาร์กอัปเป็นชุดของแท็กมาร์กอัป * เอกสาร HTML จะมีการอธิบายโดยการใช้แท็ก * แต่ละแท็กจะอธิบายเนื้อหาของเอกสารที่แตกต่างกัน
  • 3. HTML Example <!DOCTYPE html> <html> <head> <title> Page Title </title> </head> <body> <h1> My First Heading </h1> <p> My first paragraph. </p> </body> </html>
  • 4. Example Explained  อธิบายตัวอย่างโค้ดด้านบน * ประกาศ DOCTYPE กาหนดประเภทเอกสารที่จะเป็น HTML * ข้อความที่อยู่ระหว่าง <html> และ </ html> อธิบายเอกสาร HTML * ข้อความที่อยู่ระหว่าง <head> และ </ head> ให้ข้อมูลเกี่ยวกับเอกสาร * ข้อความที่อยู่ระหว่าง <title> และ </ title> ให้ชื่อของเอกสาร * ข้อความที่อยู่ระหว่าง <body> และ </ body> อธิบายเนื้อหาของหน้าเว็บ ที่มองเห็นได้ * ข้อความที่อยู่ระหว่าง <h1> และ </ h1> อธิบายหัวข้อ * ข้อความที่อยู่ระหว่าง <p> และ </ p> อธิบายวรรค !--- การใช้คาอธิบายนี้ เว็บเบราเซอร์สามารถแสดงข้อความที่มีในส่วน heading และ paragraph
  • 5. Web Browsers  ผลลัพธ์ ในเว็บ บราวเซอร์
  • 6. HTML Page Structure  โครงสร้าง HTML