Why an unordered list

An unordered list can be used in website navigation

example:unordered example


Use unordered list when ordered flow is not necessary

example: unordered list example


Use unordered list to show connection between items

  • Potatoes
  • Green Beans
  • Brocolli
Vegetables List Item

The parts of an unordered list

The parts of an unordered list.

How to make an unordered list in HTML

The code to make a unordered list

UL list

The outcome of the code look like this

We use unordered lists all of the time

When making a recipe

Ingredients

In Creating Websites

Website Code Example

CSS can be used with unordered lists

In Cascading Style Sheet the list can be altered so that the blue dot will not show up next to the list.

To do that use this code in CSS this applies to the "ul & /ul" only:

ul css example

The out come of this code looks like this

Apples
Oranges
Bananas

How to use an unordered list to make an inline nav bar

To make in inline nav bar out of an unordered list use this code in CSS. This code applies to the li & /li of the code only to make it inline

li css example code

This Code makes unordered list look like this.

Apples Oranges Bananas

How to make a functional nav bar

Now that we have our nav bar inline we need to make it do something not just be plain text. To make our unordered list nav bar link us to somewhere else we need to add this code between the li> a href=“”> /a> /li>

Here is an example of complete nav bar code to make a link

nav code example

Here is the complete code to make an unordered list to link to a website that we choose either to a page in our own sites or to another site or even an image:

unordered list to links

Here is what the compiled unordered code looks like in HTML

Without the styling of the individual pieces of the code in css we get what we have here. Adding the styling to the css or the individual pieces of the code we can make our unordered list be inline, change the font type, font color, font size, anything we want to make it not be bland and unordinary. We can even change the nav links to match the colors that we have chosen for our sites.

In closing why do we need unordered lists