How to Style Lists with CSS
HTML lists can have a number of different styles applied using CSS. Here are some of the commonly used ones.
List Style Type
Determines what the bullet looks like. For info on the possible values see the
List Style Image
For more information on using images for your bullet points, see
List Style Position
Determines whether the bullet is located inside the list's containing box or outside. For more info, see
list-style property is shorthand for setting the list properties.
By default, most browsers style lists in a certain way. For example, most lists have a bullet point or other list marker for each item. Lists also typically have padding and margin applied.
However, you might not always want lists to appear this way. In fact, it's very common for developers to use unstyled lists. Unstyled lists are those that have had any padding, margin, and list marker removed.
Unstyled lists are often used in website navigation, and other places where any list marker, padding, and margins, would just get in the way.
Here's an example of an unstyled list:
You can take it a step further and turn the unstyled list into an inline list.
You can do this by setting
display: inline-block; against the