صفت display

صفت display

توسط / CSS / سه شنبه, 24 مرداد 1396 ساعت 10:08

این صفت یکی از پر کاربردترین صفت ها در css می باشد، که نحوه ی نمایش را نشان می دهد.

این صفت برای چگونگی نمایش ،نمایش و یا عدم نمایش یک بخش به کار می رود. شما می توانید با این صفت بخش های مورد نظر را در کنار هم نمایش دهید و یا اصلا نمایش داده نشود،و فقط در شرایط خاص مانند hover ( زمانی که نشانگر موس روی آن قرار گیرد) نمایش داده شود. این صفت ویژگی های زیادی دارد که ما به برخی از آن ها می پردازیم:

ویژگی display=inline

این ویژگی باعث می شود که عنصر در خطی که قرار می گیرد به اندازه ی مورد نیاز خود فضا را اشغال کند و نه بیشتر. بعضی از تگ ها این ویژگی را به صورت پیشفرض دارا می باشند مانند span و...

 

ویژگی display=block

این ویژگی بر عکس ویژگی بالا کل خط را اشغال می کند و نمی گذارد عنصر دیگری در کنارش قرار گیرد، و تمامی خط را برای خودش در نظر می گیرد. تگ هایی هستند که این ویژگی را به صورت پیش فرض دارند  مانند div ,h1 و ...

 

ویژگی display=inline-block

این ویژگی هردو خاصیت را دارد به این معنا که عنصر خاصیت block را می گیرد ولی در یک سطح قرار می گیرد و عناصری که این خاصیت را دارند نیز در همان سطح و در کنار آن می توانند قرار گیرند.

 

ویژگی display=table

این ویژگی خواص تگ table را به عنصر می دهد . این ویژگی چندین زیر مجموعه نیز دارد که عبارتند از: 

الف) ویژگی display = table-caption

خاصیت تگ caption را به عنصر می دهد.

 

ب) ویژگی display = table-column-group

خاصیت تگ colgroup را به عنصر می دهد.

 

پ) ویژگی display = table-header-group

خاصیت تگ thead را به عنصر می دهد.

 

ت) ویژگی display = table-footer-group

خاصیت تگ tfoot را به عنصر می دهد.

 

ث) ویژگی display = table-row-group

خاصیت تگ tbody را به عنصر می دهد.

 

ج) ویژگی display = table-cell

خاصیت تگ td را به عنصر می دهد.

 

چ) ویژگی display = table-column

خاصیت تگ col را به عنصر می دهد.

 

ح)ویژگی  display = table-row

خاصیت تگ tr را به عنصر می دهد.

 

ویژگی display = inherit

این ویژگی به پدر عنصر توجه می کند.یعنی خاصیتی که پدر عنصر مورد نظر داشته باشد، عنصر نیز به ارث می برد.

 

ویژگی display=none

این ویژگی عنصر را حذف(مخفی) می کند و در زمان یا تحت شرایط خاصی با استفاده از ویژگی بلاک نمایش داده می شود.

 

ویژگی display=run-in

این ویژگی ، ویژگی اولیه ی عنصر را به آن باز می گرداند. همان طور که گفته شد بعضی عناصر مانند div و ...  display آن ها به صورت پیش فرض بلاک می باشد، و یا تگ span که display آن به صورت پیش فرض inline می باشد.

 

ویژگی display=list-item

این ویژگی خاصیت تگ li را به عنصر می دهد. امروزه افراد کمی یا شاید هم بتوان گفت کسی دیگر از این ویژگی استفاده نمی کند و از همان تگ li استفاده می شود.

 

نویسنده

حسین منتظرتبریزی

حسین منتظرتبریزی

دانشجوی رشته ی نرم افزار علاقه مند به برنامه نویسی ،بازی سازی و طراحی سایت

نظر دادن

جهت شرکت در دوره  رایگان  7 اصل مدیریت مطلوب کسب و کار لطفا نام و ایمیل خود را وارد نمایید


ایران آکادمی را در شبکه های مجازی دنبال کنید:

کلیه حقوق مادی و معنوی این وب سایت متعلق به ایران آکادمی می‌باشد. قوانین این وب سایت، مبتنی بر قوانین جاری جمهوری اسلامی ایران است. © ۱۳۹۶

Please publish modules in offcanvas position.