Skip to content
geeksforgeeks
  • Tutorials
    • Python
    • Java
    • Data Structures & Algorithms
    • ML & Data Science
    • Interview Corner
    • Programming Languages
    • Web Development
    • CS Subjects
    • DevOps And Linux
    • School Learning
    • Practice Coding Problems
  • Courses
    • DSA to Development
    • Get IBM Certification
    • Newly Launched!
      • Master Django Framework
      • Become AWS Certified
    • For Working Professionals
      • Interview 101: DSA & System Design
      • Data Science Training Program
      • JAVA Backend Development (Live)
      • DevOps Engineering (LIVE)
      • Data Structures & Algorithms in Python
    • For Students
      • Placement Preparation Course
      • Data Science (Live)
      • Data Structure & Algorithm-Self Paced (C++/JAVA)
      • Master Competitive Programming (Live)
      • Full Stack Development with React & Node JS (Live)
    • Full Stack Development
    • Data Science Program
    • All Courses
  • CSS Tutorial
  • CSS Exercises
  • CSS Interview Questions
  • CSS Selectors
  • CSS Properties
  • CSS Functions
  • CSS Examples
  • CSS Cheat Sheet
  • CSS Templates
  • CSS Frameworks
  • Bootstrap
  • Tailwind
  • CSS Formatter
Open In App

Create an Unordered List Without Bullets using CSS

Last Updated : 29 Oct, 2024
Comments
Improve
Suggest changes
Like Article
Like
Report

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

  • Using list-style-type property
  • Remove margin and padding after removing bullet points

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;
HTML
<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

Output
Unordered List Without Any Bullets

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.

HTML
<!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

Output
Unordered List Without Any Bullets



N

niharika123
Improve
Article Tags :
  • Technical Scripter
  • Web Technologies
  • HTML
  • CSS
  • Technical Scripter 2018
  • CSS-Misc

Similar Reads

    How to Write a:hover in Inline CSS?
    The :hover pseudo-selector in CSS enables you to modify the style of elements when a user hovers their mouse over them. This selector is widely used to improve user experience by adding visual feedback on elements like buttons, links, images, or any interactive items on a webpage. For the :hover eff
    2 min read
    How to place two div side-by-side of the same height using CSS?
    The two or more different div of same height can be put side-by-side using CSS. Use CSS property to set the height and width of div and use display property to place div in side-by-side format. The used display property are listed below: display:table; This property is used for elements (div) which
    2 min read
    What is a clearfix?
    A clearfix is a way for an element to automatically clear or fix its elements so that it does not need to add additional markup. It is generally used in float layouts where elements are floated to be stacked horizontally. If the element is taller than the element containing it then use the overflow
    3 min read
    Making a div Vertically Scrollable using CSS
    The overflow property in CSS controls how content that goes beyond an element's boundaries is handled. It can either hide the extra content or add scrollbars so users can scroll to see more without leaving the current view. This helps display large amounts of content, such as text, images, or tables
    3 min read
    How to give a div tag 100% height of the browser window using CSS
    CSS allows to adjustment of the height of an element using the height property. While there are several units to specify the height of an element. Set the height of a <div> to 100% of its parent container with height: 100%, or use height: 100vh; for a full viewport height, ensuring the <div
    3 min read
    Wildcard Selectors (*, ^ and $) in CSS for classes
    Wildcard selectors can be used with attribute selectors. The asterisk (*) matches any character, the caret (^) matches the start, and the dollar sign ($) matches the end of an attribute value. For example, .class* selects all elements with a class attribute containing "class" anywhere, .class^ selec
    3 min read
    How to style a dropdown using CSS?
    We will learn how to style the dropdown list using CSS and explore its implementation through examples. Dropdown menus are commonly used to allow users to select an option from a predefined list. Styling them properly can enhance your website's user experience and visual appeal.What is a <select
    3 min read
    Remove border from IFrame using CSS
    The <iframe> tag is used to embed another web page within a webpage. To remove the border from an <iframe>, you can use the frameBorder attribute in the <iframe> tag, setting its value to "0".Syntax:<iframe frameBorder="value"></iframe>Note:The frameBorder attribute is
    2 min read
    How to Hide Scrollbar with CSS
    Hiding the scrollbar with CSS can enhance the look of your webpage by removing visible scrollbars while still allowing users to scroll through content. This can create a cleaner, more streamlined user interface without sacrificing usability. In this article, we’ll explore different methods for hidin
    3 min read
    How to apply !important in CSS?
    The !important rule in CSS is used to add more importance to a property/value than normal. It forces a style to override any other declarations, ensuring the specified property value is applied, regardless of specificity. It helps resolve conflicts but should be used sparingly to avoid complicating
    2 min read
geeksforgeeks-footer-logo
Corporate & Communications Address:
A-143, 7th Floor, Sovereign Corporate Tower, Sector- 136, Noida, Uttar Pradesh (201305)
Registered Address:
K 061, Tower K, Gulshan Vivante Apartment, Sector 137, Noida, Gautam Buddh Nagar, Uttar Pradesh, 201305
GFG App on Play Store GFG App on App Store
Advertise with us
  • Company
  • About Us
  • Legal
  • Privacy Policy
  • In Media
  • Contact Us
  • Advertise with us
  • GFG Corporate Solution
  • Placement Training Program
  • Languages
  • Python
  • Java
  • C++
  • PHP
  • GoLang
  • SQL
  • R Language
  • Android Tutorial
  • Tutorials Archive
  • DSA
  • Data Structures
  • Algorithms
  • DSA for Beginners
  • Basic DSA Problems
  • DSA Roadmap
  • Top 100 DSA Interview Problems
  • DSA Roadmap by Sandeep Jain
  • All Cheat Sheets
  • Data Science & ML
  • Data Science With Python
  • Data Science For Beginner
  • Machine Learning
  • ML Maths
  • Data Visualisation
  • Pandas
  • NumPy
  • NLP
  • Deep Learning
  • Web Technologies
  • HTML
  • CSS
  • JavaScript
  • TypeScript
  • ReactJS
  • NextJS
  • Bootstrap
  • Web Design
  • Python Tutorial
  • Python Programming Examples
  • Python Projects
  • Python Tkinter
  • Python Web Scraping
  • OpenCV Tutorial
  • Python Interview Question
  • Django
  • Computer Science
  • Operating Systems
  • Computer Network
  • Database Management System
  • Software Engineering
  • Digital Logic Design
  • Engineering Maths
  • Software Development
  • Software Testing
  • DevOps
  • Git
  • Linux
  • AWS
  • Docker
  • Kubernetes
  • Azure
  • GCP
  • DevOps Roadmap
  • System Design
  • High Level Design
  • Low Level Design
  • UML Diagrams
  • Interview Guide
  • Design Patterns
  • OOAD
  • System Design Bootcamp
  • Interview Questions
  • Inteview Preparation
  • Competitive Programming
  • Top DS or Algo for CP
  • Company-Wise Recruitment Process
  • Company-Wise Preparation
  • Aptitude Preparation
  • Puzzles
  • School Subjects
  • Mathematics
  • Physics
  • Chemistry
  • Biology
  • Social Science
  • English Grammar
  • Commerce
  • World GK
  • GeeksforGeeks Videos
  • DSA
  • Python
  • Java
  • C++
  • Web Development
  • Data Science
  • CS Subjects
@GeeksforGeeks, Sanchhaya Education Private Limited, All rights reserved
We use cookies to ensure you have the best browsing experience on our website. By using our site, you acknowledge that you have read and understood our Cookie Policy & Privacy Policy
Lightbox
Improvement
Suggest Changes
Help us improve. Share your suggestions to enhance the article. Contribute your expertise and make a difference in the GeeksforGeeks portal.
geeksforgeeks-suggest-icon
Create Improvement
Enhance the article with your expertise. Contribute to the GeeksforGeeks community and help create better learning resources for all.
geeksforgeeks-improvement-icon
Suggest Changes
min 4 words, max Words Limit:1000

Thank You!

Your suggestions are valuable to us.

What kind of Experience do you want to share?

Interview Experiences
Admission Experiences
Career Journeys
Work Experiences
Campus Experiences
Competitive Exam Experiences