แท็ก details
แท็ก details สร้างสปอยเลอร์ใน HTML,
นั่นคือใช้สำหรับข้อมูลที่
สามารถซ่อนหรือแสดงได้ตามความต้องการของผู้ใช้
โดยค่าเริ่มต้นเนื้อหาภายในแท็กจะถูกซ่อนไว้
สำหรับการแสดงตามคำขอของผู้ใช้ควร
เพิ่มแท็ก
summary ซึ่งระบุหัวข้อ
สำหรับแท็ก details หัวข้อนี้จะ
มองเห็นได้บนหน้าเสมอ (แม้ว่าเนื้อหาของ details
จะอยู่ในสถานะถูกยุบ) และสามารถ
คลิกที่มันเพื่อขยายข้อความที่ซ่อนไว้
หรือยุบได้
นอกจากนี้สำหรับการแสดงเนื้อหาที่ซ่อนอยู่สามารถ
ใช้แอตทริบิวต์ open ของแท็ก details
ได้ (ตัวอย่างเช่น สำหรับการแสดงเนื้อหาของ details
โดยใช้ JavaScript)
ตัวอย่าง
มาดูกันว่าแท็ก details ทำงานอย่างไร:
<details>
<summary>click me</summary>
hidden text
</details>
:
ดูเพิ่มเติม
-
แอตทริบิวต์
hidden,
ซึ่งซ่อนบล็อกบนหน้า