SlideShare a Scribd company logo
1 of 6
Download to read offline
HTML Editors
เรียบเรียงโดย ชายดาคอมพิวเตอร์
Write HTML Using Notepad or TextEdit
 เขียน HTML โดยใช้ Notepad หรือ TextEdit
HTML สามารถแก้ไขได้โดยการ ใช้โปรแกรมแก้ไข HTML มืออาชีพเช่น :
* Sublime Text
* Notepad++
* Brackets
* Edit Plus
* Netbeans
Step 1 : Open Notepad
 ในการเปิด Notepad ใน Windows 7 หรือก่อนหน้านี้ :
Click Start (bottom left on your screen). Click All Programs.
Click Accessories. Click Notepad.
 ในการเปิด Notepad ใน Windows 8 ขึ้นไป :
Open the Start Screen (the window symbol at the bottom left on
your screen). Type Notepad.
Step 2 : Write Some HTML
เขียนหรือคัดลอก HTML บางลงใน Notepad
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
Step 3 : Save the HTML Page
 บันทึกไฟล์ในคอมพิวเตอร์
* เลือกเมนู File > Save as
* ช่อง File Name : "index.html" หรือชื่ออื่น ๆ ที่ลงท้ายด้วย html หรือ HTM
* ช่อง Save As Type : ให้เลือก All Files (*.*)
* ช่อง Encoding : ให้เลือก UTF - 8
Step 4 : View HTML Page in Your Browser
 ดู HTML ในเว็บบราวเซอร์

More Related Content

Viewers also liked

Alison Blackwell
Alison BlackwellAlison Blackwell
Alison BlackwellBioDundee
 
บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์
บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์
บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์Nattipong Siangyen
 
News Jul 6-19
News Jul 6-19 News Jul 6-19
News Jul 6-19 nuthorn
 
Flameproof Flanged Pressure Switches FC series
Flameproof Flanged Pressure Switches FC seriesFlameproof Flanged Pressure Switches FC series
Flameproof Flanged Pressure Switches FC seriesNK Instruments Pvt. Ltd.
 
Boletim 1 macro 14, 15 e 16 iguatu atualizado(1)
Boletim 1 macro 14, 15 e 16   iguatu atualizado(1)Boletim 1 macro 14, 15 e 16   iguatu atualizado(1)
Boletim 1 macro 14, 15 e 16 iguatu atualizado(1)FABIANA MARTINS
 
บทที่ 1 ทำความรู้จักเว็บเพจ
บทที่ 1 ทำความรู้จักเว็บเพจบทที่ 1 ทำความรู้จักเว็บเพจ
บทที่ 1 ทำความรู้จักเว็บเพจNattipong Siangyen
 
ADV 493 Final Presentation, A Presentation for C3 Events
ADV 493 Final Presentation, A Presentation for C3 EventsADV 493 Final Presentation, A Presentation for C3 Events
ADV 493 Final Presentation, A Presentation for C3 EventsAngela Wright
 
PYP_APA draft Final ZAC
PYP_APA draft Final ZACPYP_APA draft Final ZAC
PYP_APA draft Final ZACZachary Lette
 
ใบงานสำรวจตนเองแบร์ M6
ใบงานสำรวจตนเองแบร์ M6ใบงานสำรวจตนเองแบร์ M6
ใบงานสำรวจตนเองแบร์ M64095340953
 
Herranientas Web 2.0
Herranientas Web 2.0Herranientas Web 2.0
Herranientas Web 2.0Magdalyla
 
List of prior actions version of 26 june 20 00
List of prior actions   version of 26 june 20 00List of prior actions   version of 26 june 20 00
List of prior actions version of 26 june 20 00Emmanuel de La Houssaye
 
01 ความหมายของโครงงาน
01 ความหมายของโครงงาน01 ความหมายของโครงงาน
01 ความหมายของโครงงานNattipong Siangyen
 

Viewers also liked (20)

Interview2a
Interview2aInterview2a
Interview2a
 
Hizb 41
Hizb 41Hizb 41
Hizb 41
 
Alison Blackwell
Alison BlackwellAlison Blackwell
Alison Blackwell
 
บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์
บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์
บทที่ 1 ความหมายและประเภทของคอมพิวเตอร์
 
Tumblr workshop 3
Tumblr workshop 3Tumblr workshop 3
Tumblr workshop 3
 
News Jul 6-19
News Jul 6-19 News Jul 6-19
News Jul 6-19
 
Flameproof Flanged Pressure Switches FC series
Flameproof Flanged Pressure Switches FC seriesFlameproof Flanged Pressure Switches FC series
Flameproof Flanged Pressure Switches FC series
 
Pasos scratch
Pasos  scratchPasos  scratch
Pasos scratch
 
Ultrasonic Flow Meter ASIONIC 400W
Ultrasonic Flow Meter ASIONIC 400WUltrasonic Flow Meter ASIONIC 400W
Ultrasonic Flow Meter ASIONIC 400W
 
Le journal d'Argentré-du-Plessis
Le journal d'Argentré-du-PlessisLe journal d'Argentré-du-Plessis
Le journal d'Argentré-du-Plessis
 
Boletim 1 macro 14, 15 e 16 iguatu atualizado(1)
Boletim 1 macro 14, 15 e 16   iguatu atualizado(1)Boletim 1 macro 14, 15 e 16   iguatu atualizado(1)
Boletim 1 macro 14, 15 e 16 iguatu atualizado(1)
 
Espn Mike Leach
Espn Mike LeachEspn Mike Leach
Espn Mike Leach
 
บทที่ 1 ทำความรู้จักเว็บเพจ
บทที่ 1 ทำความรู้จักเว็บเพจบทที่ 1 ทำความรู้จักเว็บเพจ
บทที่ 1 ทำความรู้จักเว็บเพจ
 
ADV 493 Final Presentation, A Presentation for C3 Events
ADV 493 Final Presentation, A Presentation for C3 EventsADV 493 Final Presentation, A Presentation for C3 Events
ADV 493 Final Presentation, A Presentation for C3 Events
 
PYP_APA draft Final ZAC
PYP_APA draft Final ZACPYP_APA draft Final ZAC
PYP_APA draft Final ZAC
 
ใบงานสำรวจตนเองแบร์ M6
ใบงานสำรวจตนเองแบร์ M6ใบงานสำรวจตนเองแบร์ M6
ใบงานสำรวจตนเองแบร์ M6
 
Herranientas Web 2.0
Herranientas Web 2.0Herranientas Web 2.0
Herranientas Web 2.0
 
List of prior actions version of 26 june 20 00
List of prior actions   version of 26 june 20 00List of prior actions   version of 26 june 20 00
List of prior actions version of 26 june 20 00
 
01 ความหมายของโครงงาน
01 ความหมายของโครงงาน01 ความหมายของโครงงาน
01 ความหมายของโครงงาน
 
Dual High range Pressure Switch DS series
Dual High range Pressure Switch DS seriesDual High range Pressure Switch DS series
Dual High range Pressure Switch DS series
 

Similar to บทที่ 3 html editors

ใบความรู้ที่ 2.4 ขั้นตอนการสร้างเว็บhtml
ใบความรู้ที่ 2.4 ขั้นตอนการสร้างเว็บhtmlใบความรู้ที่ 2.4 ขั้นตอนการสร้างเว็บhtml
ใบความรู้ที่ 2.4 ขั้นตอนการสร้างเว็บhtmlSmo Tara
 
รวมสารพัดชื่อไวรัสคอม + อาการ + วิธีแก้
รวมสารพัดชื่อไวรัสคอม + อาการ + วิธีแก้รวมสารพัดชื่อไวรัสคอม + อาการ + วิธีแก้
รวมสารพัดชื่อไวรัสคอม + อาการ + วิธีแก้วิโรจน์ พรรณหาญ
 
รู้จักกับ Html(แก้ไข)
รู้จักกับ Html(แก้ไข)รู้จักกับ Html(แก้ไข)
รู้จักกับ Html(แก้ไข)Beerza Kub
 
2.เริ่มต้นกับ xhtml และ xhtml
2.เริ่มต้นกับ xhtml และ xhtml2.เริ่มต้นกับ xhtml และ xhtml
2.เริ่มต้นกับ xhtml และ xhtmlBeerza Kub
 
Session1 part2
Session1 part2Session1 part2
Session1 part2maovkh
 
โปรแกรม Net beans
โปรแกรม Net beansโปรแกรม Net beans
โปรแกรม Net beansBoOm mm
 
การสร้างเว็บด้วย Macromedia dreamweaver8
การสร้างเว็บด้วย Macromedia dreamweaver8การสร้างเว็บด้วย Macromedia dreamweaver8
การสร้างเว็บด้วย Macromedia dreamweaver8doraemonbookie
 
ณหทัย ซอเฮง รหัส 56170219
ณหทัย ซอเฮง รหัส 56170219ณหทัย ซอเฮง รหัส 56170219
ณหทัย ซอเฮง รหัส 56170219cream3703
 
หน่วยการเรียนรู้ที่ 3 html
หน่วยการเรียนรู้ที่ 3 htmlหน่วยการเรียนรู้ที่ 3 html
หน่วยการเรียนรู้ที่ 3 htmldevilp Nnop
 
การเข้าใช้โปรแกรมซี Dev C++
การเข้าใช้โปรแกรมซี Dev C++การเข้าใช้โปรแกรมซี Dev C++
การเข้าใช้โปรแกรมซี Dev C++dechathon
 

Similar to บทที่ 3 html editors (12)

ใบความรู้ที่ 2.4 ขั้นตอนการสร้างเว็บhtml
ใบความรู้ที่ 2.4 ขั้นตอนการสร้างเว็บhtmlใบความรู้ที่ 2.4 ขั้นตอนการสร้างเว็บhtml
ใบความรู้ที่ 2.4 ขั้นตอนการสร้างเว็บhtml
 
รวมสารพัดชื่อไวรัสคอม + อาการ + วิธีแก้
รวมสารพัดชื่อไวรัสคอม + อาการ + วิธีแก้รวมสารพัดชื่อไวรัสคอม + อาการ + วิธีแก้
รวมสารพัดชื่อไวรัสคอม + อาการ + วิธีแก้
 
รู้จักกับ Html(แก้ไข)
รู้จักกับ Html(แก้ไข)รู้จักกับ Html(แก้ไข)
รู้จักกับ Html(แก้ไข)
 
2.เริ่มต้นกับ xhtml และ xhtml
2.เริ่มต้นกับ xhtml และ xhtml2.เริ่มต้นกับ xhtml และ xhtml
2.เริ่มต้นกับ xhtml และ xhtml
 
Session1 part2
Session1 part2Session1 part2
Session1 part2
 
โปรแกรม Net beans
โปรแกรม Net beansโปรแกรม Net beans
โปรแกรม Net beans
 
Pai02
Pai02Pai02
Pai02
 
vb.net
vb.netvb.net
vb.net
 
การสร้างเว็บด้วย Macromedia dreamweaver8
การสร้างเว็บด้วย Macromedia dreamweaver8การสร้างเว็บด้วย Macromedia dreamweaver8
การสร้างเว็บด้วย Macromedia dreamweaver8
 
ณหทัย ซอเฮง รหัส 56170219
ณหทัย ซอเฮง รหัส 56170219ณหทัย ซอเฮง รหัส 56170219
ณหทัย ซอเฮง รหัส 56170219
 
หน่วยการเรียนรู้ที่ 3 html
หน่วยการเรียนรู้ที่ 3 htmlหน่วยการเรียนรู้ที่ 3 html
หน่วยการเรียนรู้ที่ 3 html
 
การเข้าใช้โปรแกรมซี Dev C++
การเข้าใช้โปรแกรมซี Dev C++การเข้าใช้โปรแกรมซี Dev C++
การเข้าใช้โปรแกรมซี Dev C++
 

More from Nattipong Siangyen

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

More from Nattipong Siangyen (20)

บทที่ 2 ประเภทของคอมพิวเตอร์ (ตามราคาและความเร็ว)
บทที่ 2 ประเภทของคอมพิวเตอร์ (ตามราคาและความเร็ว)บทที่ 2 ประเภทของคอมพิวเตอร์ (ตามราคาและความเร็ว)
บทที่ 2 ประเภทของคอมพิวเตอร์ (ตามราคาและความเร็ว)
 
บทที่ 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 ข้อมูลและสารสนเทศ
 
01ข้อมูลและสารสนเทศ
01ข้อมูลและสารสนเทศ01ข้อมูลและสารสนเทศ
01ข้อมูลและสารสนเทศ
 
10 กรณีศึกษา
10 กรณีศึกษา10 กรณีศึกษา
10 กรณีศึกษา
 
อ้างอิง
อ้างอิงอ้างอิง
อ้างอิง
 
02 การทำโครงงานอย่างง่าย
02 การทำโครงงานอย่างง่าย02 การทำโครงงานอย่างง่าย
02 การทำโครงงานอย่างง่าย
 

บทที่ 3 html editors

  • 2. Write HTML Using Notepad or TextEdit  เขียน HTML โดยใช้ Notepad หรือ TextEdit HTML สามารถแก้ไขได้โดยการ ใช้โปรแกรมแก้ไข HTML มืออาชีพเช่น : * Sublime Text * Notepad++ * Brackets * Edit Plus * Netbeans
  • 3. Step 1 : Open Notepad  ในการเปิด Notepad ใน Windows 7 หรือก่อนหน้านี้ : Click Start (bottom left on your screen). Click All Programs. Click Accessories. Click Notepad.  ในการเปิด Notepad ใน Windows 8 ขึ้นไป : Open the Start Screen (the window symbol at the bottom left on your screen). Type Notepad.
  • 4. Step 2 : Write Some HTML เขียนหรือคัดลอก HTML บางลงใน Notepad <!DOCTYPE html> <html> <body> <h1>My First Heading</h1> <p>My first paragraph.</p> </body> </html>
  • 5. Step 3 : Save the HTML Page  บันทึกไฟล์ในคอมพิวเตอร์ * เลือกเมนู File > Save as * ช่อง File Name : "index.html" หรือชื่ออื่น ๆ ที่ลงท้ายด้วย html หรือ HTM * ช่อง Save As Type : ให้เลือก All Files (*.*) * ช่อง Encoding : ให้เลือก UTF - 8
  • 6. Step 4 : View HTML Page in Your Browser  ดู HTML ในเว็บบราวเซอร์