โปรแกรม แก้ไข HTML
โปรแกรมแก้ไขข้อความอย่างง่ายคือสิ่งที่คุณต้องเรียนรู้ HTML
เรียนรู้ HTML โดยใช้ Notepad หรือ TextEdit
หน้าเว็บสามารถสร้างและแก้ไขได้โดยใช้โปรแกรมแก้ไข HTML ระดับมืออาชีพ
อย่างไรก็ตาม สำหรับการเรียนรู้ HTML เราขอแนะนำโปรแกรมแก้ไขข้อความอย่างง่าย เช่น Notepad (PC) หรือ TextEdit (Mac)
เราเชื่อว่าการใช้โปรแกรมแก้ไขข้อความอย่างง่ายเป็นวิธีที่ดีในการเรียนรู้ HTML
ทำตามขั้นตอนด้านล่างเพื่อสร้างหน้าเว็บแรกของคุณด้วย Notepad หรือ TextEdit
ขั้นตอนที่ 1: เปิด Notepad (พีซี)
Windows 8 หรือใหม่กว่า:
เปิดหน้าจอเริ่มต้น (สัญลักษณ์หน้าต่างที่ด้านล่างซ้ายบนหน้าจอของคุณ) พิมพ์แผ่นจดบันทึก
Windows 7 หรือเก่ากว่า:
เปิดStart > Programs > Accessories > Notepad
ขั้นตอนที่ 1: เปิด TextEdit (Mac)
เปิดFinder > แอปพลิเคชัน > TextEdit
เปลี่ยนการตั้งค่าบางอย่างเพื่อให้แอปพลิเคชันบันทึกไฟล์ได้อย่างถูกต้อง ในการตั้งค่า > รูปแบบ > เลือก"ข้อความธรรมดา"
จากนั้นภายใต้ "เปิดและบันทึก" ให้ทำเครื่องหมายในช่องที่ระบุว่า "แสดงไฟล์ HTML เป็นโค้ด HTML แทนข้อความที่จัดรูปแบบ"
จากนั้นเปิดเอกสารใหม่เพื่อวางรหัส
ขั้นตอนที่ 2: เขียน HTML . บางส่วน
เขียนหรือคัดลอกโค้ด HTML ต่อไปนี้ลงใน Notepad:
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
ขั้นตอนที่ 3: บันทึกหน้า HTML
บันทึกไฟล์บนคอมพิวเตอร์ของคุณ เลือกไฟล์ > บันทึกเป็นในเมนู Notepad
ตั้งชื่อไฟล์"index.htm"และตั้งค่าการเข้ารหัสเป็น UTF-8 (ซึ่งเป็นการเข้ารหัสที่ต้องการสำหรับไฟล์ HTML)
เคล็ดลับ:คุณสามารถใช้ .htm หรือ .html เป็นนามสกุลไฟล์ได้ ไม่มีความแตกต่างขึ้นอยู่กับคุณ
ขั้นตอนที่ 4: ดูหน้า HTML ในเบราว์เซอร์ของคุณ
เปิดไฟล์ HTML ที่บันทึกไว้ในเบราว์เซอร์ที่คุณชื่นชอบ (ดับเบิลคลิกที่ไฟล์หรือคลิกขวา - แล้วเลือก "เปิดด้วย")
ผลลัพธ์จะมีลักษณะดังนี้:
W3Schools Online Editor - "ลองด้วยตัวคุณเอง"
ด้วยโปรแกรมแก้ไขออนไลน์ฟรีของเรา คุณสามารถแก้ไขโค้ด HTML และดูผลลัพธ์ในเบราว์เซอร์ของคุณได้
เป็นเครื่องมือที่สมบูรณ์แบบเมื่อคุณต้องการทดสอบโค้ดอย่างรวดเร็ว นอกจากนี้ยังมีรหัสสีและความสามารถในการบันทึกและแชร์รหัสกับผู้อื่น:
ตัวอย่าง
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
คลิกที่ปุ่ม "ลองด้วยตัวคุณเอง" เพื่อดูว่ามันทำงานอย่างไร
W3Schools Spaces
หากคุณต้องการสร้างเว็บไซต์ของคุณเองและบันทึกโค้ดของคุณทางออนไลน์ ให้ลอง ใช้ตัว สร้างเว็บไซต์ฟรี ของเรา ที่เรียกว่าW3schools Spaces :