117 of 133 menu

แท็ก details

แท็ก details สร้างสปอยเลอร์ใน HTML, นั่นคือใช้สำหรับข้อมูลที่ สามารถซ่อนหรือแสดงได้ตามความต้องการของผู้ใช้

โดยค่าเริ่มต้นเนื้อหาภายในแท็กจะถูกซ่อนไว้ สำหรับการแสดงตามคำขอของผู้ใช้ควร เพิ่มแท็ก summary ซึ่งระบุหัวข้อ สำหรับแท็ก details หัวข้อนี้จะ มองเห็นได้บนหน้าเสมอ (แม้ว่าเนื้อหาของ details จะอยู่ในสถานะถูกยุบ) และสามารถ คลิกที่มันเพื่อขยายข้อความที่ซ่อนไว้ หรือยุบได้

นอกจากนี้สำหรับการแสดงเนื้อหาที่ซ่อนอยู่สามารถ ใช้แอตทริบิวต์ open ของแท็ก details ได้ (ตัวอย่างเช่น สำหรับการแสดงเนื้อหาของ details โดยใช้ JavaScript)

ตัวอย่าง

มาดูกันว่าแท็ก details ทำงานอย่างไร:

<details> <summary>click me</summary> hidden text </details>

:

ดูเพิ่มเติม

  • แอตทริบิวต์ hidden,
    ซึ่งซ่อนบล็อกบนหน้า
ไทย
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItaliano日本語ქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣTürkmenTürkçeЎзбекOʻzbekTiếng Việt
เราใช้คุกกี้สำหรับการทำงานของเว็บไซต์ การวิเคราะห์ และการปรับเนื้อหาให้เหมาะสมส่วนบุคคล การประมวลผลข้อมูลเกิดขึ้นตาม นโยบายความเป็นส่วนตัว.
ยอมรับทั้งหมด ปรับแต่ง ปฏิเสธ