In this lesson we will learn how to create lists on a webpage. We will get to know two types of lists: the numbered ones, called ordered lists and the ones with symbols, called unordered lists.
<ul> </ul> - it marks an unordered/unnumbered list. It is an abbreviation for the words unordered list.
<ol> </ol> - it marks the ordered/numbered lists. It is an abbreviation for the words ordered list.
<li> </li> - it marks a list item for both types of lists. It is an abbreviation for list item.
A HTML tag may have attributes (properties). In the case of the lists we can use the type attribute to change the symbol used in marking a list item. This works for both types of lists. As the HTML language develops and changes, many of the attributes are transferred to the CSS languages sphere of action.
In the case of unordered lists:
- <ul type = "square">
- <ul type = "disc">
- <ul type = "circle">
For ordered lists:
- <ol type = "1"> - numbers
- <ol type = "I"> - roman numbers using uppercase letters
- <ol type = "i"> - roman numbers using lowercase letters
- <ol type = "A"> - uppercase letters
- <ol type = "a"> - lowercase letters
We set the following steps for making a website:
- Firstly, a simple visual presentation is needed, including:
- an outline of page structure (that is called “wireframe”);
- shapes and colors;
- illustrative pictures.
2. Then you have to script it into an actual dynamic and interactive web page, that has: - buttons from navigation;
- posts to upload;
- cute pictures;
- invisible data flowing behind (so called back-end, which rules the buttons, the posts and the cute pictures).
3. You have to take care of a server, which is the place that hosts and serves pages to users.
<ul>
<li>Java</li>
<li>C++</li>
<li>JavaScript<li>
<li>C#</li>
</ul>
<ol>
<li>Paragraph</li>
<li>List Header</li>
</ol>