html5 คืออะไร แล้วต่างจาก html เวอร์ชั่นก่อนหน้ายังไง ? มาดูกัน
html5 มันพัฒนามาจาก html4 ซึ่งเขาได้เพิ่มฟิจเจอร์ให้มันสามารถทำงานได้มีประสิทธิภาพมากยิ่งขึ้น เช่น มีการเพิ่มแท็กใหม่ๆ เพื่อให้นักพัฒนาได้พัฒนาแอพพลิเคชั่นได้เร็วขึ้น เป็นต้น
ตัวอย่าง tag ของ HTML5
<ABBR> แสดงตัวย่อ
ตัวอย่างคำสั่ง
ตัวอย่างผลลัพธ์
ขอต้อนรับเข้าสู่…กรุงเทพฯ
<BDO> กำหนดทิศทางการอ่าน-เขียนข้อความ
ตัวอย่างคำสั่ง
<bdo dir=” rtl “>แสองข้อความจากขวาไปซ้าย</bdo>
ตัวอย่างผลลัพธ์
แสดงข้อความจากซ้ายไปขวา
แสองข้อความจากขวาไปซ้าย
<CANVAS> สำหรับวาดรูปกราฟิก
ตัวอย่างคำสั่ง
<script>
var canvas=document.getElementById(‘square’);
var ctx=canvas.getContext(‘2d’);
ctx.fillStyle=’#FF0000′;
ctx.fillRect(0,0,200,200);
</script>
ตัวอย่างผลลัพธ์
<CAPTION> กำหนดคำอธิบายตาราง
ตัวอย่างคำสั่ง
<caption>ใส่คำอธิบายตารางที่นี่</caption>
<tr>
<th>เดือน</th>
<th>รายได้</th>
<th>เงินเก็บ</th>
</tr>
<tr>
<td>มกราคม</td>
<td>30,000</td>
<td>10,000</td>
</tr>
<tr>
<td>กุมภาพันธ์</td>
<td>40,000</td>
<td>20,000</td>
</tr>
<tr>
<td>มีนาคม</td>
<td>50,000</td>
<td>30,000</td>
</tr>
</table>
ตัวอย่างผลลัพธ์
เดือน | รายได้ | เงินเก็บ |
---|---|---|
มกราคม | 30,000 | 10,000 |
กุมภาพันธ์ | 40,000 | 20,000 |
มีนาคม | 50,000 | 30,000 |
<CITE> แสดงข้อความอ้างอิง
ตัวอย่างคำสั่ง
<cite>อ้างอิงจาก https://th.wikipedia.org/wiki/ม้าโทรจัน_(คอมพิวเตอร์)</cite>
ตัวอย่างผลลัพธ์
ม้าโทรจัน (อังกฤษ: Trojan horse) หมายถึง โปรแกรมคอมพิวเตอร์ที่ถูกบรรจุเข้าไปในคอมพิวเตอร์ เพื่อลอบเก็บข้อมูลของคอมพิวเตอร์เครื่องนั้น เช่น ข้อมูลชื่อผู้ใช้ รหัสผ่าน เลขที่บัญชีธนาคาร หมายเลขบัตรเครดิต
อ้างอิงจาก https://th.wikipedia.org/wiki/ม้าโทรจัน_(คอมพิวเตอร์)
<DATALIST> แสดงคำช่วยเหลือเมื่อกรอกข้อมูล
ตัวอย่างคำสั่ง
<input list=”language” name=”language” >
<datalist id=”language” >
<option value=”ASP.net” >
<option value=”PHP” >
<option value=”Python” >
<option value=”Javascript” >
</datalist>
</form>
ตัวอย่างผลลัพธ์
<DEL> แสดงข้อความขีดฆ่า
ตัวอย่างคำสั่ง
ตัวอย่างผลลัพธ์
โทรศัพท์ที่ฉันใช้คือ Samsung iPhones
<DETAILS> กำหนดรายละเอียดเพิ่มเติม
ตัวอย่างคำสั่ง
<summary>Computer</summary>
<p>คอมพิวเตอร์จัดเป็นเครื่องอิเล็กทรอนิกส์ ที่สร้างขึ้นเพื่อประมวลผลแทนมนุษย์</p>
</details>
ตัวอย่างผลลัพธ์
Computer
คอมพิวเตอร์จัดเป็นเครื่องอิเล็กทรอนิกส์ ที่สร้างขึ้นเพื่อประมวลผลแทนมนุษย์
<FIELDSET> จัดกลุ่มฟิวส์ให้กับฟอร์ม
ตัวอย่างคำสั่ง
<fieldset>
<legend>กรอกข้อมูล</legend>
ชือ: <input type=”text” name=”name”> <input type=”submit” value=”ส่งข้อมูล”>
</fieldset>
</form>
ตัวอย่างผลลัพธ์
<METER> เครื่องมือวัดข้อมูล
ตัวอย่างคำสั่ง
<meter value=”0.8″>80%</meter>
ตัวอย่างผลลัพธ์
<OPTION> แสดงตัวเลือกในลิส
ตัวอย่างคำสั่ง
<option value=”php”>php</option>
<option value=”sql”>mysql</option>
<option value=”javascript”>javascript</option>
</select>
ตัวอย่างผลลัพธ์
<PROGRESS> แสดงความคืบหน้าการทำงาน
ตัวอย่างคำสั่ง
ตัวอย่างผลลัพธ์
<SUB> แสดงข้อความตัวห้อย
ตัวอย่างคำสั่ง
ตัวอย่างผลลัพธ์
ข้อความปกติ ข้อความตัวห้อย
<SUP> แสดงข้อความตัวยก
ตัวอย่างคำสั่ง
ตัวอย่างผลลัพธ์
ข้อความปกติ ข้อความตัวห้อย
<TBODY> กำหนดขอบเขตข้อมูลในตาราง
ตัวอย่างคำสั่ง
<tfoot>
<tr><td>รวม</td> <td>30</td></tr>
</tfoot>
<tbody>
<tr><td>มกราคม</td> <td>10</td></tr>
<tr><td>กุมภาพันธ์</td> <td>20</td></tr>
</tbody>
<thead>
<tr><th>เดือน</th> <th>ยอดขาย</th></tr>
</thead>
</table>
ตัวอย่างผลลัพธ์
รวม | 30 |
มกราคม | 10 |
กุมภาพันธ์ | 20 |
เดือน | ยอดขาย |
---|