list-style-image

با استفاده از ویژگی list-style-image می توان برای نشانه گر آیتم های یک لیست تصویر قرار داد.

این ویژگی همچنین می تواند بر روی عناصری که display آنها از نوع list-item است کنترل داشته باشد.

زمانی که تصویر در دسترس باشد مقداری که توسط ویژگی list-style-type در نظر گرفته شده است نادیده گرفته می شود.

 

مقادیر ویژگی list-style-image

 


list-style-image: <url> | none | inherit

 

 

none

این مقدار، مقدار پیشفرض و اولیه می باشد که باعث می شود تا تصویری به عنوان نشانه گر لیست نمایش داده نشود.

 

url

آدرس تصویری که قرار است به عنوان نشانه گر برای آیتم های لیست نمایش داده شود.

 


ul { 
  list-style-image: url('images/img.png'); 
}

 

 

inherit

مقداری که برای لیست پدر تعیین شده است به عنصر نیز ارث می رسد.

 

مثال

دموی زیر را بررسی کنید:

 

See the Pen list-style-image by Mojtaba Seyedi (@seyedi) on CodePen.


 

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *