خصوصیت visibility

چاپ

مثال (خصوصیت visibility)

مخفی کردن عنصر <h2>:

h2
{
visibility:hidden;
}
خودتان امتحان کنید »

در انتهای این آموزش، مثال های بیشتری را خواهید دید.


تعریف و کاربرد

با استفاده از خصوصیت visibility می توانید، یک عنصر را نمایش بدهید یا آن را مخفی کنید.

نکته: در خصوصیت visibility حتی عناصر مخفی نیز فضای صفحه را اشغال می کند، بعبارتی فضای آنها رزرو شده باقی می ماند. با استفاده از خصوصیت "display" می توانید عناصر را جوری مخفی نمایید که اثری از آنها در صفحه باقی نماند.

مقدار پیشفرض visible
ارث بری بله
نسخه CSS2
JavaScript ساختار object.style.visibility="hidden"

پشتیبانی مرورگرها

Internet Explorer Firefox Opera Google Chrome Safari

تمام مرورگرهای اصلی، خصوصیت visibility را پشتیبانی می کنند.

توجه: هیچ کدام از نسخه های Internet Explorer (حتی IE8) مقدار "inherit" را برای خصوصیت visibility پشتیبانی نمی کنند.


مقدارهای خصوصیت

مقدارتوضیحاتنمایش دادن
visible

مقدار پیش فرض. عنصر نمایش داده می شود.

نمایش دادن »
hidden

عنصر مخفی می شود. (اما هنوز فضای برای عنصر رزرو باقی می ماند.)

نمایش دادن »
collapse

فقط برای جدول به کار می رود. collapse یک ستون یا ردیف را حذف می کند، اما روی چیدمان جدول تاثیری ندارد. فضایی که برای ردیف یا ستون نگه داشته شده بود، برای محتواهای دیگر در دسترس است.

اگر collapse برای عنصری استفاده شود مانند "hidden" با آن رفتار می شود.

نمایش دادن »
inherit تعیین می کند که باید از والدش، ارث بری داشته باشد.  

مثالs

مثال - خودتان امتحان کنید

How to make a table element collapse
این مثال نحوه collapse کردن یک عنصر جدول را نمایش می دهد.


بیاموزهای مرتبط

CSS Display (بیاموز CSS)