The li tag in HTML
- 24-07-2022
- Trung Minh
- 0 Comments
In this article we will learn the li tag in HTML, this is the tag inside the ol or ul tag, used to create the elements for the list.
1. What is the li tag in HTML used for?
The li tag defines an item in the list. It is a child tag, inside two parent tags, ol or ul. When you deliberately set it to stand alone, you will get the error of HTML structure.
Use the li tag in sorted lists ( the ol tag ), unsorted lists ( the ul tag ), and in menu lists ( the menu tag ).
The syntax in the ul tag is as follows:
<ul> <li>Phần tử 1</li> <li>Phần tử 2</li> <li>Phần tử 3</li> <li>Phần tử 4</li> </ul>
The syntax in the ol tag is as follows :
<ol> <li>Phần tử 1</li> <li>Phần tử 2</li> <li>Phần tử 3</li> <li>Phần tử 4</li> </ol>
2. How to use li tag in HTML
Example 1 : Use the li tag in combination with the ol tag to create a list of courses.
<!DOCTYPE html> <html> <head> <title>Học lập trình miễn phí tại web888.vn</title> <meta charset="utf-8"> </head> <body> <h1>Học lập trình miễn phí tại web888.vn</h1> <ol> <li>PHP</li> <li>Javascript</li> <li>Css</li> <li>HTML</li> </ol> </body> </html>
3. Format li tags in CSS
If you want to use CSS to change the format of the li tag, you can use the following syntax:
<style> ul li{ } // hoặc ol li{ } </style>
What it means is : Set for all li tags in the ul tag, the same for the second case is the ol tag.
If you want to remove special characters before elements, use the following CSS property:
<style> ul li{ list-style: none } </style>
4. HTML li tag attribute
li is supported by most of the attributes of the Global Attributes in HTML group.
Browser support :
- Chrome
- Firefox
- IE
- Safari
- Opera
Above is the information as well as how to use the ul tag.