Menu
Components & UI
CSS Lists
Styling unordered and ordered lists.
1List Styles
Remove bullets or change markers.
Example Code
css
ul {
list-style-type: none; /* Remove bullets */
padding: 0;
}
li {
padding: 5px 0;
}2Understand it in a real interface
List styling should preserve the idea that several related items belong together. Removing bullets can suit navigation, but it should not turn a sequence of instructions into an unclear paragraph. The HTML list type should match whether order matters; CSS changes appearance rather than that meaning.
3Try it yourself
Create an unordered feature list and an ordered set of setup steps. Style their markers and spacing separately. Add a long item that wraps onto two lines and check that the indentation still makes each item’s start easy to identify.
Finished reading?
Mark this topic as complete to track progress.