Create an Unordered List Without Bullets using CSS
Last Updated :
29 Oct, 2024
Improve
To create an unordered list without bullet points, the CSS list-style-type property is used. This removes the default bullet points from the list items, and making the list appear plain.
Table of Content
Unordered List Without Bullets using list-style-type Property
You can use the list-style-type property to remove bullets from an unordered list using CSS. Apply list-style-type: none; to the <ul> tag to remove the default bullets from the list items.
Syntax
list-style-type: none;<p>Computer science subject lists:</p>
<ul style="list-style-type: none;">
<li>Data Structure</li>
<li>Algorithm</li>
<li>Computer Networks</li>
<li>Operating System</li>
<li>Theory of Computations</li>
<li>Computer Organization and Architecture</li>
<li>Discrete Mathematics</li>
<li>C Programming</li>
</ul>
Output
How to Remove Padding and Margin after Removing Bullet Points?
To remove margin and padding after removing bullet points, use margin: 0; and padding: 0; to remove the default spacing around the list.
<!DOCTYPE html>
<html lang="en">
<head>
<style>
ul {
list-style-type: none;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<ul>
<li>Data Structure</li>
<li>Algorithm</li>
<li>Computer Networks</li>
<li>Operating System</li>
<li>Theory of Computations</li>
<li>Computer Organization and Architecture</li>
<li>Discrete Mathematics</li>
<li>C Programming</li>
</ul>
</body>
</html>
Output
