Use list-style-type:none property to Remove bullets from UL CSS in HTML. You have to use the style attribute as inline CSS. But the usage of style attribute overrides any style set globally.
Example of the unordered list without any bullets
Here is an example of remove bullets from ul
lists by setting the CSS list-style-type
property to none
. As an output, the bullets disappear from the list.
<!DOCTYPE html>
<html>
<body>
<h2>Unordered List without Bullets</h2>
<ul style="list-style-type:none;">
<li>Apple</li>
<li>Mango</li>
<li>Orange</li>
</ul>
</body>
</html>
Output:.
Remove default margin and padding from UL tag
An HTML list also has default margin and padding. You can remove this as well, add margin:0
and padding:0
to <ul>:
<ul style="list-style-type:none; margin: 0; padding: 0;">
Use can use it as internal or external CSS.
<!DOCTYPE html>
<html>
<body>
<h2>Unordered List without Bullets</h2>
<ul style="list-style-type:none; margin: 0; padding: 0;">
<li>Apple</li>
<li>Mango</li>
<li>Orange</li>
</ul>
</body>
</html>
Do comment if you know about more on this topic or have any question.
Note: The All HTML Examples codes are tested on the Firefox browser and the Chrome browser.
OS: Windows 10
Code: HTML 5 Version