HTML details Tag

HTML details Tag – يحدد الوسم <details> تفاصيل إضافية يمكن للمستخدم من خلالها الحصول على معلومات، وفتحها وإغلاقها عند الطلب.

HTML details Tag

يمكنك وضع أي نوع من المحتوى (نصوص – قوائم – روابط – صور – ..إلخ) داخل وسم <details>.

مثال

<details>
    <summary>How do you manage your time?</summary>
    <ul>
        <li>Set goals</li>
        <li>Set a deadline for each goal</li>
        <li>Write down everything you want to do daily</li>
        <li>Take breaks</li>
    </ul>    
</details>

How do you manage your time?

Set goals
Set a deadline for each goal
Write down everything you want to do daily
Take breaks

يٌستخدم الوسم <summary> مع وسم <details> كوسيلة او ملخصًا لإيضاح التفاصيل.

السمات المحددة – Specific Attributes

يدعم الوسم <details> هذه السمة:

السمة	القيمة	الوصف
open	open	يحدد أن التفاصيل يجب أن تكون مرئية (اى مفتوحة) للمستخدم. إذا كانت القيمة الإفتراضية false سيتم إخفاء التفاصيل.