HTML Lists CS 1150 Spring 2017

Types of Lists Ordered lists are lists where each item in the list is numbered Unordered lists are lists that begin with a bullet point (rather than characters that indicate order) Definition lists are made up of a set of terms along with the definitions for each of those terms

The <li> element Each item in a list is placed between an opening <li> tag and a closing </li> tag (the li stands for list item) Browsers indent lists by default The different types of lists are created with <ol> (ordered list), <ul> (unordered list), and <dl> (definition list)

Ordered Lists The ordered list is created with the <ol> element Each item in the list is placed between an opening <li> tag and a closing </li> tag Example: https://cs.mtsu.edu/~crn2k/public/courses/1150/HTMLExamples/ordered_lis t.html

Unordered Lists The unordered list is created with the <ul> element Each item in the list is placed between an opening <li> tag and a closing </li> tag Example: https://cs.mtsu.edu/~crn2k/public/courses/1150/HTMLExamples/unordered_ list.html

Definition Lists The definition list is created with the <dl> element Inside the <dl> elements you will usually see pairs of <dt> and <dd> elements <dt> is used to contain the term being defined <dd> is used to contain the definition Example: https://cs.mtsu.edu/~crn2k/public/courses/1150/HTMLExamples/definition_list.htm l

Nested Lists You can put a second list inside a <li> element to create a sub-list or nested list Browsers display nested lists indented further than the parent list In nested unordered lists, the browser will usually change the style of the bullet point too Example: https://cs.mtsu.edu/~crn2k/public/courses/1150/HTMLExamples/nested_list.html