<

Custom List Bullets in CSS

Posted on
6,108 Points
108 Views
Last Modified:
Experience Level: Beginner
3:27
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS.

Video Steps

1. Begin with a normal unordered list; the default bullet point is a solid circle

2. In the CSS, create a defined class of unordered list by typing "ul.Square"

3. Define the shape of the custom bullet point by using the "list-style-type:" property. For a square bullet point, define the property as "square"; you can also type "disc" for a hollow circle

4. To set an image as your bullet point, use the "list-style-image:" property. Set the image using url('Image.PNG'); format

0
Comment
0 Comments

Featured Post

Cloud Class® Course: CompTIA Cloud+

The CompTIA Cloud+ Basic training course will teach you about cloud concepts and models, data storage, networking, and network infrastructure.

Join & Write a Comment

Suggested Videos

Title Views Activity
Creating an Image Sprite 81
Alpha Transparency in CSS 57
Rounded Corner Effect in CSS 67
Introduction to CSS (Part 2) 109
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.

Keep in touch with Experts Exchange

Tech news and trends delivered to your inbox every month