آموزش HTML 5 > تگ های جدید HTML 5  >  تگ < summary >

تگ < summary >  :

از این تگ برای اضافه کردن زیر مجموعه و توضیحات به یک تگ <details> استفاده می شود . کاربر می تواند با کلیک بر روی تگ <details> محتویات درونی آن را مخفی یا نمایان سازد . در حالت پیش فرض محتویات درونی تگ <details> مخفی هستند .

شکل کلی استفاده از یک تگ < summary > بصورت زیر است :

syntax <details>
     .....
    <summary > محتویات </summary>
    ....
</details>

پشتیانی در مرورگر های مختلف :

این تگ فقط در مرورگر کروم پشتیبانی می شود .

مثال عملی :

در مثال های زیر ، نحوه استفاده از تگ < summary > را در 2 حالت متفاوت آن ، در عمل نمایش داده ایم :

توجه ! : این مثال فقط در مرورگر کروم  کار می کند .
 نکته : اگر خاصیت open تگ < details > را بر روی مقدار open قرار دهیم ، محتویات درونی آن نمایشض داده می شود . در غیر اینصورت طبق حالت پیش فرض ، محتویات در ابتدا مخفی هستند .

مثال             حالت اول
open عدم تعیین خاصیت
<details>
      <summary>Copyright 2008-2013.</summary>
      <p> - by Developer1.ir : All Rights Reserved.</p>
</details>

حالت دوم
open تعیین خاصیت
<details open>
      <summary>Copyright 2008-2013.</summary>
      <p> - by Developer1.ir : All Rights Reserved.</p>
</details>
خروجی
Copyright 2008-2013.

- by Developer1.ir : All Rights Reserved.



Copyright 2008-2013.

- by Developer1.ir : All Rights Reserved.



راجع این مطلب سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...         >>>>>  ورود به انجمن تخصصی


نظر خودتان درباره این صفحه را با ما در میان بگذارید  :

آیا مطالب این صفحه برای شما مناسب و مفید بود ه است :

نام :                 
آدرس Email :    
 
نظر شما :  
 
سوال امنیتی : جمع سه + پنج چنده ؟