CSS List-Style Property

In this chapter you will learn:
About list-style property
Examples of list-style property
CSS list-style property is used to display list in different styles like circle, square, image etc. It helps to create web page attractive and list looks impressive. It can set the style of all the list in one declaration.
Examples of this property- Example 1.
list-style:square;

<html>
<head>
    <title>list-style property</title>
    <style type="text/css">
        ul
        {
            list-style:square; /* list-style property */
        }
</style>
</head>
<body>
<ul>
<li>one</li>
<li>two</li>
<li>three</li>
<li>four</li>
<li>five</li>
</ul>
</body>
</html>

Output:-
example of list-style:sruare Example 2. list-style:circle; 
<html>
<head>
    <title>list-style property</title>
    <style type="text/css">
        ul
        {
            list-style:circle; /* list-style property */
        }
</style>
</head>
<body>
<ul>
<li>one</li>
<li>two</li>
<li>three</li>
<li>four</li>
<li>five</li>
</ul>
</body>
</html>

Output:- example of list-style:circle

Summary

In this chapter you have learned about the list-style property and how to use in your program so now, it will better for you to try it yourself to use this property in another program. Click on Next button to continue-

 

Share your thought