Thursday, 3 November 2011

All CSS List Properties


This property is used to set different type of styles for the list items.

Property
Description
Values
CSS
list-style
Sets all the properties for a list in one declaration
list-style-type
list-style-position
list-style-image
inherit
1
list-style-image
Specifies an image as the list-item marker
URL
none
inherit
1
List-style-position
Specifies where to place the list-item marker
inside
outside
inherit
1
List-style-type
Specifies the type of list-item marker
none
disc
circle
square
decimal
decimal-leading-zero
armenian
georgian
lower-alpha
upper-alpha
lower-greek
lower-latin
upper-latin
lower-roman
upper-roman
inherit
1


Example - 1

<html>
<head>
     <style type=”text/css”>               
li
              {
                        list-style-type:square;
                        List-style-position:outside;           
              }
     </style>
</head>
<body>
     <p> List of subject
              <ul>
                        <li>PHP</li>
                        <li>SAD</li>
                        <li>VB</li>
                        <li>C++</li>                                                                               
              </ul>
     </p>
</body>
</html>


Example - 2

<html>
<head>
     <style type=”text/css”>               
li
              {
                        list-style-image:url(bullet.png);
              }
     </style>
</head>
<body>
     <p> List of subject
              <ul>
                        <li>PHP</li>
                        <li>SAD</li>
                        <li>VB</li>
                        <li>C++</li>                                                                               
              </ul>
     </p>
</body>
</html>

No comments:

Post a Comment