<

Custom List Bullets in CSS

Posted on
6,066 Points
66 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

On Demand Webinar: Networking for the Cloud Era

Did you know SD-WANs can improve network connectivity? Check out this webinar to learn how an SD-WAN simplified, one-click tool can help you migrate and manage data in the cloud.

Join & Write a Comment

Suggested Videos

Title Views Activity
Creating an Image Sprite 67
Box Shadow Effect in CSS 101
Drop-Cap Effect in CSS 53
Introduction to CSS (Part 1) 62
Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
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.
Suggested Courses
Course of the Month7 days, 23 hours left to enroll

Keep in touch with Experts Exchange

Tech news and trends delivered to your inbox every month