Scribd
Upload
78 views

Creating Lists: Unordered List

This document discusses how to create lists and tables in HTML. It explains that there are two types of lists: unordered lists which use bullets and ordered lists which number items sequentially. List items are defined using the <li> tag. Tables are created with the <table> tag and include table headings <th>, rows <tr>, and data cells <td>. The document outlines several attributes that can be applied to lists, tables, and individual table components to control styling and formatting.

Uploaded by

Anuj Kumar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
78 views

Creating Lists: Unordered List

This document discusses how to create lists and tables in HTML. It explains that there are two types of lists: unordered lists which use bullets and ordered lists which number items sequentially. List items are defined using the <li> tag. Tables are created with the <table> tag and include table headings <th>, rows <tr>, and data cells <td>. The document outlines several attributes that can be applied to lists, tables, and individual table components to control styling and formatting.

Uploaded by

Anuj Kumar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

Creating Lists

You can create a list in HTML. However it is a little bit tough. In most cases, we use two types of
lists:

Unordered List

Ordered List

To display any item in a list, we use the <li> tag which stands for List Item. It is an empty
element tag.

Unordered List <UL>


It is used when we do not want to display items in a sequence. The default bullet in Unordered
List is a small filled disk circle like the one displayed above.
Syntax- <ul>
<Li>Unordered List
<Li>Ordered List
</ul>
Output

Unordered List

Ordered List

Attributes Of Unordered List


Type Attribute: Specifies the type of bullet. It has 3 values:
1. Disk (default)
2. Circle (An empty disk)

3. Square (A filled Square)

Ordered List <OL>


It is used when we want to display items in a sequence. The default bullets in Ordered List are
numbers.
Syntax- <ol>
<Li>Unordered List
<Li>Ordered List
</ol>
Output
1. Unordered List
2. Ordered List

Attributes Of Ordered List


Type Attribute: Specifies the type of bullet. It has 5 values:
1. A (Upper Case Letters)
2. a (Lower Case Letters)
3. I (Upper Case Roman Numerals)
4. i (Lower Case Roman Numerals)
5. 1 (Default)

Start Attribute: Specifies the position from where you want to start a list.

Syntax- <ol type=a start=3>


<Li>Name
<Li>Class
<Li>R. No
Output- c Name
d Class
e R. No

Creating Tables
To create a table in HTML, we use the Table <table> tag.
To specify a table heading, use a Table heading <th> tag
To specify a table row, use a Table row <tr> tag
To give table data, use the tag <td>. If there are multiple columns, continue typing, but close the
<td> tag and start a new one.

Attributes Of Table Tag


Border Attribute: This attribute draws a border around the table which is not drawn by
default. The larger the value, the thicker the border is. If the value is 0, or the attribute is not
used, no border will be drawn.

Border color Attribute: This attribute specifies the border color. The default color is grey, but
we can change it.

Background color Attribute: This attribute specifies the background color of the table. The
default color is grey, but we can change it.

Aligning Attribute: This attribute specifies the aligning of the content of the table. By default,
the content is left aligned, but we can change it with center or right.

Cell Padding Attribute: This attribute specifies the distance between the content of the table
and the cell walls. The value is specified in pixels.

Cell Spacing Attribute: This attribute specifies the minimum distance between two adjacent
cells. The value is specified in pixels.

Height and Width Attribute: This attribute specifies the height and width of the table. The
value can be specified in percentage or pixels.

Attributes Of <tr> <td> and <th> Tag


Border color Attribute: This attribute specifies the border color. The default color is grey, but
we can change it.

Background color Attribute: This attribute specifies the background color. The default color
is grey, but we can change it.

Syntax- <table border=1 bgcolor=cyan height=300 width=400>


<tr bordercolor=red bgcolor=yellow>
<th>S. No</th><th>Name</th><th>Grades</th>
</tr>
<tr>
<td>1</td><td>Sharat</td><td>A2</td>
</tr>
<tr>
<td>2</td><td>Raghav</td><td>A2</td>

</tr>
<tr>
<td>3</td><td>Prabal</td><td>A1</td>
</tr>
</table>

You might also like