Html List Items

The UNORDERED LIST or <ul> uses bullet points to differentiate the line items, each bullet point needs to be given a <li> for the creation of the bullet.

See the Pen Unordered-List by jhoffmanbcc (@jhoffmanbcc) on CodePen.

An ORDERED LIST or <ol> creates numbered points and each number needs to be given a <li>, after each <li> the numbers will incrementally grow.

See the Pen Ordered-List by jhoffmanbcc (@jhoffmanbcc) on CodePen.

A DESCRIPTION LIST or <dl>  defines names and describes each of those names.  <dt> will define the term names and <dd> will describe each of the names.

See the Pen Description-List by jhoffmanbcc (@jhoffmanbcc) on CodePen.

SPAN is an element that is considered an inline element.  When using an inline element, the script all stays on the same line.  To put it into context, the span is like using a ( ) parentheses when writing a paper.

He finally answered (after taking five minutes to think) that he did not want to accept the lower price for the sale of his car.

In the sentence above the parentheses (after taking five minutes to think) adds an enhanced element to the sentence.  That enhanced element occurs inline with the rest of the sentence, provides more detail, and does not demand its own sentence.

Span tags can provide more visual detail and emphasis in the html script. Lets look at the html code below, between the paragraph tags <p> that begin and end the sentence, we added a span style, as we see in the example above, the proper way to add a style element with a span.

See the Pen pEyLak by jhoffmanbcc (@jhoffmanbcc) on CodePen.

This code looks a lot like an image tag in the way it is organized.  We open span style and we set it equal to a piece of CSS code, we assign the text to be colored, and we close the span tag.  In future classes we will learn how to add many different style elements with a variation of web scripting that works with cascading style sheets or css.