We are independent & ad-supported. We may earn a commission for purchases made through our links.
Advertiser Disclosure
Our website is an independent, advertising-supported platform. We provide our content free of charge to our readers, and to keep it that way, we rely on revenue generated through advertisements and affiliate partnerships. This means that when you click on certain links on our site and make a purchase, we may earn a commission. Learn more.
How We Make Money
We sustain our operations through affiliate commissions and advertising. If you click on an affiliate link and make a purchase, we may receive a commission from the merchant at no additional cost to you. We also display advertisements on our website, which help generate revenue to support our work and keep our content free for readers. Our editorial team operates independently of our advertising and affiliate partnerships to ensure that our content remains unbiased and focused on providing you with the best information and recommendations based on thorough research and honest evaluations. To remain transparent, we’ve provided a list of our current affiliate partners here.
Software

Our Promise to you

Founded in 2002, our company has been a trusted resource for readers seeking informative and engaging content. Our dedication to quality remains unwavering—and will never change. We follow a strict editorial policy, ensuring that our content is authored by highly qualified professionals and edited by subject matter experts. This guarantees that everything we publish is objective, accurate, and trustworthy.

Over the years, we've refined our approach to cover a wide range of topics, providing readers with reliable and practical advice to enhance their knowledge and skills. That's why millions of readers turn to us each year. Join us in celebrating the joy of learning, guided by standards you can trust.

What Are the Different Types of HTML List Style?

By Eugene P.
Updated: May 16, 2024
References

There are three basic types of HyperText Markup Language (HTML) list styles. The first is an unordered list, and it is made up of a series of bulleted elements listed vertically in sequence. The second HTML list style is an ordered list and is identical to an unordered list except that, instead of a single type of bullet, each of the list elements is numbered in sequence. The third HTML list style is a definition list that lists an item, followed on the next line or after a wide indentation by its definition. Each HTML list style can be broadly customized through some HTML tags, such as the type tag, or they can be specifically customized through cascading style sheet (CSS) properties.

There are some abilities that each HTML list style shares. They can be nested within each other, meaning an ordered list can have an unordered list as a list element. A list can be customized through CSS so everything from the spacing around each list element to the type of bullet used can be modified to fit a particular design. All HTML lists also can list nearly anything as a list element or definition, including hyperlinks, images, scripts or even graphical user interface (GUI) components such as text fields.

An unordered list is the most basic HTML list style. It is simply an ordered list of elements, with each element beginning on a new line after the previous one. By default, a circular bullet is placed just before each new element, although this image can be changed to another shape or removed altogether.

An ordered list is similar in many aspects to the unordered HTML list style except the bullets are replaced with sequential numbering. The numbers can either be standard decimal, Roman numerals, letters or a variety of other numbering systems from different languages. When ordered lists are nested, the numbering for the nested lists can be changed, causing the list to appear more like a traditional structured outline. Like unordered lists, the leading numbers also can be disabled.

The final type of HTML list style is known as a definition list. Each element of this kind of list is made from two elements — the term and the definition. The term is the word that will be defined and is the first item displayed in the list element. The definition is generally a sentence or other element that somehow explains, or is related to, the term. The definition can either be rendered next to the term, on the same line but spaced far apart, or it can be rendered on the next line down and indented, which is the default behavior. A definition list can be customized with CSS properties, but it does not contain an area for bullets to be displayed.

EasyTechJunkie is dedicated to providing accurate and trustworthy information. We carefully select reputable sources and employ a rigorous fact-checking process to maintain the highest standards. To learn more about our commitment to accuracy, read our editorial process.
Link to Sources
Discussion Comments
Share
https://www.easytechjunkie.com/what-are-the-different-types-of-html-list-style.htm
EasyTechJunkie, in your inbox

Our latest articles, guides, and more, delivered daily.

EasyTechJunkie, in your inbox

Our latest articles, guides, and more, delivered daily.