I want to create multiple classes for hyperlink styles.
I want a default class as well as a special class for the navigation menu.
This is my CSS code:
a {
color: white;
text-decoration: none;
}
.menu-items a {
color: black;
text-decoration: none;
}
I tried calling the "menu-items" class in the html, but it continues to use the default a{} style shown above.
This is the html code:
<div class="container-outside">
<div class="container-inside">
<ul class="ul-list">
<li>
<a class="menu-items" href="temperature.html">Temperature</a></li>
<li>|</li>
<li>Weight</li>
<li>|</li>
<li>Currency</li>
</ul>
</div>
</div>
I tried removing the default class and creating two special classes without success. A bit overwhelmed here.
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
You can directly put the class name.menu-items
Your selector is incorrect because
menu-itemsis not the parent ofas. You should select the tag like this:a.menu-items { color: black; text-decoration: none;}