ອະທິບາຍເບື້ອງຕົ້ນກ່ຽວກັບພາສາ HTML ເໝາະສຳລັບນັກຮຽນ, ນັກສຶກສາ ແລະ ຜູ້ເລີ່ມຕົ້ນຮຽນເຮັດເວັບໄຊ 💻🌐
1. HTML ແມ່ນຫຍັງ?
HTML (HyperText Markup Language) ແມ່ນພາສາພື້ນຖານທີ່ໃຊ້ສ້າງໂຄງສ້າງຂອງເວັບໄຊ (Website) ແລະ ໜ້າເວັບ (Web Page) ທີ່ພວກເຮົາເຫັນຜ່ານ Web Browser ເຊັ່ນ Google Chrome, Firefox, Edge ຫຼື Safari
HTML ບໍ່ແມ່ນພາສາໂປຣແກຣມມິ່ງ (Programming Language) ແຕ່ເປັນ Markup Language ໝາຍຄວາມວ່າ ໃຊ້ “Tag” ເພື່ອກຳນົດໂຄງສ້າງ ແລະ ຄວາມໝາຍຂອງເນື້ອຫາ
ຕົວຢ່າງ:
คัดลอกโค้ด
Html
<h1>ສະບາຍດີ HTML</h1>
<p>ນີ້ແມ່ນໜ້າເວັບທົດລອງ</p>
2. ປະຫວັດໂດຍຫຍໍ້ຂອງ HTML
HTML ຖືກພັດທະນາໂດຍ Tim Berners-Lee ໃນປີ 1991 ເພື່ອໃຊ້ແບ່ງປັນຂໍ້ມູນໃນອິນເຕີເນັດ
ພັດທະນາມາເປັນຫຼາຍລຸ້ນ ເຊັ່ນ:
HTML 2.0
HTML 3.2
HTML 4.01
HTML5 (ໃຊ້ກັນຫຼາຍທີ່ສຸດໃນປັດຈຸບັນ)
HTML5 ຮອງຮັບວິດີໂອ, ສຽງ, Canvas, Form ທີ່ທັນສະໄໝ ແລະ ເຮັດວຽກກັບ JavaScript ໄດ້ດີຂຶ້ນ
3. ໂຄງສ້າງພື້ນຖານຂອງ HTML
ໜ້າ HTML ໜຶ່ງໜ້າ ຈະມີໂຄງສ້າງພື້ນຖານດັ່ງນີ້:
คัดลอกโค้ด
Html
<!DOCTYPE html>
<html>
<head>
<title>ໜ້າເວັບຂອງຂ້ອຍ</title>
</head>
<body>
<h1>ຍິນດີຕ້ອນຮັບ</h1>
<p>ນີ້ແມ່ນເນື້ອຫາໜ້າເວັບ</p>
</body>
</html>
ອະທິບາຍ:
<!DOCTYPE html> ບອກ browser ວ່າເປັນ HTML5
<html> ແມ່ນ tag ຫຼັກ
<head> ເກັບຂໍ້ມູນຂອງເວັບ
<body> ເປັນສ່ວນທີ່ຜູ້ໃຊ້ເຫັນ
4. HTML Tag ແມ່ນຫຍັງ?
Tag ແມ່ນຄຳສັ່ງທີ່ຢູ່ໃນ <>
ມີ 2 ປະເພດ:
Tag ເປີດ – Tag ປິດ
คัดลอกโค้ด
Html
<p>ຂໍ້ຄວາມ</p>
Tag ບໍ່ມີປິດ
คัดลอกโค้ด
Html
<br>
<img src="image.jpg">
5. Tag ທີ່ໃຊ້ບໍ່ອຍໃນ HTML
5.1 Tag ຂໍ້ຄວາມ
<h1> – <h6> ຫົວຂໍ້
<p> ຂໍ້ຄວາມ
<b> / <strong> ຕົວໜາ
<i> / <em> ຕົວອ່ຽງ
5.2 Tag ລິ້ງ
คัดลอกโค้ด
Html
<a href="https://google.com">Google</a>
5.3 Tag ຮູບພາບ
คัดลอกโค้ด
Html
<img src="photo.jpg" alt="ຮູບພາບ">
5.4 Tag ຕາຕະລາງ
คัดลอกโค้ด
Html
<table>
<tr><th>ຊື່</th><th>ອາຍຸ</th></tr>
<tr><td>ສົມພອນ</td><td>20</td></tr>
</table>
6. Form ແລະ Input ໃນ HTML (ຕາມຮູບທີ່ໃຫ້ມາ)
Form ແມ່ນສ່ວນທີ່ໃຊ້ຮັບຂໍ້ມູນຈາກຜູ້ໃຊ້
ຕົວຢ່າງ:
คัดลอกโค้ด
Html
<form>
<input type="text">
<input type="password">
<input type="email">
</form>
ປະເພດ input ທີ່ສຳຄັນ:
text ປ້ອນຂໍ້ຄວາມ
password ລະຫັດ
radio ເລືອກຢ່າງດຽວ
checkbox ເລືອກຫຼາຍ
button ປຸ່ມ
color ເລືອກສີ
email ອີເມວ
file ເລືອກໄຟລ໌
hidden ເຊື່ອງຂໍ້ມູນ
image ປຸ່ມແບບຮູບ
number ຕົວເລກ
7. HTML ກັບ CSS ແລະ JavaScript
HTML: ໂຄງສ້າງ
CSS: ຄວາມສວຍງາມ (ສີ, ຟອນ, ຮູບແບບ)
JavaScript: ຄວາມສາມາດໂຕ້ຕອບ
HTML ຄື “ໂຄງກະດູກ”
CSS ຄື “ເສື້ອຜ້າ”
JavaScript ຄື “ສະໝອງ” 🧠
8. ຂໍ້ດີຂອງ HTML
ຮຽນງ່າຍ
ຟຣີ
ໃຊ້ໄດ້ທຸກ Browser
ເປັນພື້ນຖານຂອງ Web Development
9. ສະຫຼຸບ
HTML ແມ່ນພາສາພື້ນຖານທີ່ຂາດບໍ່ໄດ້ໃນການສ້າງເວັບໄຊ ເຖິງແມ່ນຈະບໍ່ຊັບຊ້ອນ ແຕ່ເປັນພື້ນຖານສຳຄັນທີ່ສຸດ
0 $type={blogger}:
แสดงความคิดเห็น