صفت list-style در css

صفت list-style در css نشانه گر آیتم لیست تگ html

در این مقاله از سایت آموزی جهت استفاده شما همراهان گرامی قصد داریم در مورد خاصیت list-style در زبان css توضیحاتی را ارائه نماییم.

ویژگی کاربردی list-style در زبان css و در اولین نسخه این زبان طراحی یعنی css1 معرفی شده است.

معرفی و کاربرد ویژگی جدید list-style در زبان طراحی سی اس اس

به کمک خاصیت list-style می توانیم تصویر ، مکان و نوع نشانه گر آیتم های لیست را درون تگ های html مشخص کنیم.

خصوصیت list-style در حقیقت به نوعی یک مختصرنویسی برای 3 ویژگی دیگر مرتبط با آیتم های لیست در زبان سی اس اس می باشد، که عبارتند از: 

1. خصوصیت list-style-type
2. خصوصیت list-style-position
3. خصوصیت list-style-image

خصوصیت list-style می تواند بر روی آن دسته از تگ های html که صفت display در آنها از نوع list-item است نیز تاثیر داشته باشد.

مقادیر صفت جدید list-style در زبان طراحی css

صفت list-style که در زبان طراحی CSS1 معرفی شده است، 5 مقدار می پذیرد که عبارتند از:

1. مقدار list-style-type
2. مقدار list-style-position
3. مقدار list-style-image
4. مقدار initial
5. مقدار inherit

صفت list-style در css نشانه گر آیتم لیست تگ html

مقدار list-style-type درون خاصیت list-style در زبان سی اس اس

اگر خاصیت list-style را برای یک عنصر html برابر با مقدار list-style-type تعریف کنیم، یعنی می خواهیم نوع نشانگر آیتم های لیست را در عنصر html مربوطه تعیین کنیم.

مقدار پیش فرض برای این حالت مقدار disc می باشد.

[html] div{ list-style: disc; }[/html]

مقدار list-style-position درون خاصیت list-style در زبان css

اگر خاصیت list-style را برای یک عنصر html برابر با مقدار list-style-position تعریف کنیم، یعنی می خواهیم موقعیت نشانگر آیتم های لیست را در داخل یا خارج باکس اصلی عنصر html مربوطه تعیین کنیم.

[html] div{ list-style: outside; }[/html]

مقدار list-style-image درون خاصیت list-style در زبان سی اس اس

اگر خاصیت list-style را برای یک تگ html برابر با مقدار list-style-image تعریف کنیم، یعنی می خواهیم یک آدرس ( url ) جهت فراخوانی تصویری برای نشانگر آیتم های یک لیست دورن یک عنصر html تعریف کنیم.

[html] div{ list-style: url(‘sqpurple.gif’); }[/html]

مقدار initial درون خاصیت list-style در زبان css

اگر خاصیت list-style را برابر با مقدار initial تعریف کنیم، در حقیقت مقدار پیش فرض این خصوصیت برای تگ html مورد نظر اعمال می شود.

مقدار inherit درون خاصیت list-style در زبان سی اس اس

اگر خاصیت list-style را برابر با مقدار inherit تعریف کنیم، در واقع تگ html مربوطه خصوصیت مورد نظر را از والد پدری خود به ارث می برد.

بررسی خاصیت list-style از نظر نسخه زبان طراحی css

ویژگی کاربردی list-style در زبان css و در اولین نسخه این زبان طراحی یعنی css1 معرفی شده است.

بررسی ساختاری خصوصیت list-style در زبان طراحی سی اس اس

عناوین ساختاری خاصیت list-style	وضعیت ساختاری خاصیت list-style
مقدار پیش فرض	disc outside none
قابلیت توارث	دارد
قابلیت تحرک	ندارد
ورژن css صفت	CSS1
سینتکس صفت در جاوا اسکریپت	"object.style.listStyle="decimal inside

پشتیبانی مرورگرهای اینترنتی از خاصیت list-style در زبان طراحی css

خاصیت css
list-style	1.0	4.0	1.0	1.0	7.0