خصائص list-style CSS
- الصفحة السابقة line-height
- الصفحة التالية list-style-image
Definition and Usage
The list-style shorthand property sets all list properties in one declaration.
Description
This is a shorthand property that covers all other list style properties. Since it applies to all elements with display set to list-item, it can only be used for li elements in ordinary HTML and XHTML, although it can be applied to any element and inherited by list-item elements.
You can set the following properties in order:
You can omit one of the values, for example "list-style:circle inside;" is also allowed. Properties that are not set will use their default values.
See also:
CSS Tutorial:قائمة CSS
HTML DOM Reference Manual:listStyle Property
Example
Set the image as the list item marker in the list:
ul
{
list-style:square inside url('/i/arrow.gif');
}
CSS Syntax
list-style: list-style-type list-style-position list-style-image|initial|inherit;
Property Value
| Value | Description |
|---|---|
| list-style-type | Sets the type of the list item markers. See also:list-style-type Possible Values. |
| list-style-position | Sets where to place the list item markers. See also:list-style-position Possible Values. |
| list-style-image | Use images to replace the list item markers. See also:list-style-image Possible Values. |
| inherit | Specifies that the value of the list-style property should be inherited from the parent element. |
Technical Details
| Default Value: | disc outside none |
|---|---|
| Inheritance: | yes |
| Version: | CSS1 |
| JavaScript Syntax: | object.style.listStyle="decimal inside" |
مزيد من الأمثلة
- تحديد جميع خاصيات القائمة في بيان واحد
- هذا المثال يوضح كيفية وضع جميع خاصيات القائمة في خاصية مختصرة.
دعم المتصفح
الرقم في الجدول يوضح الإصدار الأولي للمتصفح الذي يدعم هذه الخاصية بالكامل.
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 4.0 | 1.0 | 1.0 | 7.0 |
- الصفحة السابقة line-height
- الصفحة التالية list-style-image
