HTML Unordered Lists


In HTML, unordered lists are used to group items together without implying a numerical order. Each item in an unordered list is typically marked with a bullet point or some other symbol. The <ul> (unordered list) element is used to define the list, and each item within the list is represented by the <li> (list item) element.

Here's an example of an unordered list:

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

This code will render as follows:

  • Item 1
  • Item 2
  • Item 3

With CSS, you may alter the way the bullet points look. As an illustration::

<style>
  ul {
    list-style-type: square; /* Change bullet point style to a square */
  }
</style>

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

In this example, the list-style-type property is set to "square," changing the default bullet point style to squares.

You can also use different values for the list-style-type property, such as "circle," "disc," "none" (to remove the bullets), and others, to achieve different visual styles.

<style>
  ul {
    list-style-type: circle; /* Change bullet point style to a circle */
  }
</style>

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

This code will display a circular bullet point for each item in the list. Feel free to experiment with different values to achieve the desired visual effect for your unordered lists.

Post a Comment

Previous Post Next Post

Popular Items