How to Install Operating System ??Complete Guide Installing The Operating System

How To Make List HTML

e-Book Computer – In this tutorial, we will discuss how to create a list of lists in HTML, this list or list function usually leads to sorting a text in which each text in it has its own points, so sequencing of each word is needed, as well as the list fill in a book. Actually there is nothing different from the list or list on Ms. Word, to Ms. Word lists or lists have two types, namely ordered lists and unordered lists, the difference is in ordered lists, which are sequences using numbers and written with the code <ol>, while the unordered list uses symbols and is written with the code <ul>.

Before going forward, there are a number of articles that you might be looking for.

Read too :

How to Make a List in HTML

The tag list in html is one of the tags written in pairs, namely the opening tag and closing tag are used to create a list of lists in html, that is the tag <ol> </ ol> or <ul> </ ul>, the tag is used to define type sorting while for sorting the text uses the <li> </ li> tag that is installed in the opening tag <ol> or </ ul> depending on what type of list you want to make. Tags like this can be called nested tags, or nested tags, where the tag <ol> or <ul> becomes the head, while <li> </ li> becomes the body, the tag <ol> or </ ul> is written only once in each sort list, while the <li> tag is written based on the number of texts you want to sort.

<! DOCTYPE html>

<html>

<head>

<title> Create a list / list in HTML </ title>

</ head>

<body>

<h1> How to create a list / list in HTML </ h1>

<ol>

<li> This is an example of an ordered list list </ li>

<li> This is an example of an ordered list list </ li>

<li> This is an example of an ordered list list </ li>

<li> This is an example of an ordered list list </ li>

<li> This is an example of an ordered list list </ li>

</ ol>

</ body>

</ html>

Actually on an ordered list other than numbers you can also display other sorting types, such as roman and others, the way is simply to add the “type” attribute without quotes, for example the author will sort the alphabetical list with uppercase letters.

<ol type = “A”>

….

</ ol>

The following is a table of sorting types that can be used for ordered lists.

List of Ordered List Types

TypeInformation
type=”1"Sort Using Numbers (Default)
type=”A”Sorting By Uppercase
type=”a”Sorting By Lowercase
type=”I”Sorting Uses Uppercase Roman Numerals
type=”i”Sorting Uses Lowercase Roman Numerals

 

Create a List / Symbol List in HTML

To create a list of lists with symbols then using the html <ul> tag, please open your text editor and then type the html code below.

<! DOCTYPE html>

<html>

<head>

<title> Create a list / list in HTML </ title>

</ head>

<body>

<h1> How to create a list / list in HTML </ h1>

<ul>

<li> This is an example of a list of unordered lists </ li>

<li> This is an example of a list of unordered lists </ li>

<li> This is an example of a list of unordered lists </ li>

<li> This is an example of a list of unordered lists </ li>

<li> This is an example of a list of unordered lists </ li>

</ ul>

</ body>

</ html>

Unordered lists actually have symbol types such as ordered lists, except that the difference is an ordered list using numbers or alphabets, while unordered lists use symbols, also different types of writing, when ordered lists directly use types then undered lists use style attributes, attributes this allows writing the css code directly written in the relevant tag without creating another css file, here is an example.

<ul style = “list-style-type: circle”>

….

</ ul>

The following is a list of symbol types in sorting using an unordered list.

List of Unordered list Types

TypeInformation
list-style-type:discSorting Using The Bullets Symbol (default)
list-style-type:circleSorting Using Circle Symbol
list-style-type:squareSorting Using Box Symbols

 

Make a List Nested With HTML

In addition to only listing vertically, you can also display nested lists, meaning that each item that appears in the list has a list of children below it, here is an example of an HTML code that creates a nested list.

<! DOCTYPE html>

<html>

<head>

<title> Creates a list / nested list in HTML </ title>

</ head>

<body>

<h1> How to make a list / list nested in HTML </ h1>

<ul>

<li> Example of a nested list

<ul>

<li> Nested list items </ li>

<li> Nested list items </ li>

<li> Nested list items </ li>

</ ul>

</ li>

<li> Example of a nested list

<ul>

<li> Nested list items </ li>

<li> Nested list items </ li>

<li> Nested list items </ li>

</ ul>

</ li>

<li> Example of a nested list

<ul>

<li> Nested list items </ li>

<li> Nested list items </ li>

<li> Nested list items </ li>

</ ul>

</ li>

</ ul>

</ body>

</ html>

For example, using the nested list above only uses twice, readers can experiment by displaying nested lists more than the example above, and also please combine them with symbol types from the list above.

So this tutorial how to create a list of lists in HTML, hopefully useful, and hope the author, to practice not with copy/paste, type in each code above to get used to and memorize by itself.

Before proceeding, there are a number of articles that might be looking for.

Also read :

Sending
User Review
0 (0 votes)

Add a Comment

Your email address will not be published. Required fields are marked *