Book Image

Practical Web Development

By : Paul Wellens
Book Image

Practical Web Development

By: Paul Wellens

Overview of this book

Table of Contents (23 chapters)
Practical Web Development
Credits
About the Author
Acknowledgments
About the Reviewers
www.PacktPub.com
Preface
10
XML and JSON
Index

Styling lists


One element that you will end up using a lot is the <ul> tag: the unordered list. By default, every item in the list will be shown with a round bullet in front of the text. With CSS, you can change the style of your list.

list-style-type

Using this property, you can change the shape of the bullet. Some of the values you can use are: none (no bullet at all), square (a square), circle (a small circle), or disc (the default).

list-style-image

You can provide your own image for the bullet by using the list-style-image property. The default value is none, which means that the bullet image is determined by the value of list-style-type. However if you specify url, followed by a path to an image, that image will be used instead, for example:

url('smiley.gif')

list-style-position

By default, the bullets appear outside the content flow. If you specify inside as the value of list-style-position, the bullets will move to the inside and the text more to the right.