Posts in current category
May 03, 2021 21:00 CSS
The CSS list properties work as follows:
In HTML, there are two types of HTML lists:
With CSS, you can list further styles and mark them with images as list items.
specifies that the type of list item tag is:
Some values are unseeded tables, and some are ordered lists.
The following is a description of the common property values of the
noneBullets are not used
lower-alphalowercase English letters
lower-romanlower-case Roman numerals
upper-romanCapital Roman numerals
To specify an image marked by a list item, use the list style image properties:
The above examples vary across major browsers, with IE and Opera showing image tags a little higher than Firefox, Chrome and Safari.
list-style-positiondetermine whether a flag appears outside or inside the content of a list item.
- If you want to place the same image logo in all browsers, you should use a browser compatibility solution in the following ways.
Also in all browsers, the following example shows the image tag:
You can specify all list properties in a single property. This is called a short-case property.
Using short-case properties for lists, list style properties are set as follows:
If the order in which the abbreviated property values are used is:
list-style-position(see CSS property sheet below for instructions)
In short write properties, it doesn't matter if one of the above values is missing and the rest is still in the specified order.
All the different list item tags
This example demonstrates all the different CSS list item tags.
|list-style||Short-case properties. Used to set all the properties used for the list in one declaration|
|list-style-image||Set the image as a list item flag.|
|list-style-position||Set the location of the list item flag in the list.|
|list-style-type||Set the type of list item flag.|