<分区>
html - 列表样式类型 : none does not work in the removal of bullets(dots) attached with items in the navigation bar
输出:
I am an absolute beginner and while creating my basic navigation bar I am facing the issue. I want to eradicate the red circled dots associated with my list items. Please tell me where I am doing wrong. My previous question was marked duplicated and this reference was provided : I need an unordered list without any bullets This is my old question: Removal of bullets(dots) attached with items in the navigation bar
The solution states that
list-style-type: none;will resolve the issue and I also applied this solution to my code and nothing changed.
CSS 代码:
*{padding: 0; margin: 0; box-sizing: border-box;}
#Header
{
background-color: #ffad66;
font-family: 'Reem Kufi', sans-serif;
font-weight: 900;
font-size: 50px;
color: #800000;
text-align: center;
height: 120px;
box-sizing: border-box;
padding: 22px;
/* this line was not in my code from the previous question which was marked duplicated and*/
list-style-type: none;
}
.NavItems a
{
text-decoration: none;
list-style: none;
font-size: 14px;
font-weight: bold;
font-family: 'Times New Roman', Times, serif;
color:green;
margin: 10px;
padding: 10px;
}
.NavItems a:hover
{
background-color: #33E3FF;
color: black;
}
.NavBarItem
{
display: flex;
justify-content: center;
}
.MyNavBar
{
width: 100%;
background-color: lightblue;
height: 35px;
box-sizing: border-box;
padding: 8px;
}
HTML 代码: 这是 body 标签下唯一的一段代码。
<header id="Header">
پوشاک
</header>
<nav class="MyNavBar">
<ul class="NavBarItem">
<li class="NavItems"><a href="#Men">Men</a></li>
<li class="NavItems"><a href="#Women">Women</a></li>
<li class="NavItems"><a href="#Kids">Kids</a></li>
</ul>
</nav>
最佳答案
list-style: none; 必须在 ul 而不是 a 标签上
关于html - 列表样式类型 : none does not work in the removal of bullets(dots) attached with items in the navigation bar，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/59633565/