我在使用 css 突出显示文本时遇到问题

Question

I am having problems with the css side of the hypertext link, the strings that transport you to the other pages of the website, they are not highlighting when I hover over the message, when it comes to the stuff, I cannot see the problems with the code, could i have some help with this please?:

 ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #333; } li { float: left; } li a { color: white; text-align: center; padding: 14px 16px; text-decoration: none; hover: red; } a { color: white; } } a:hover { color: red; }

 <u1> <li style="list-style-type: none;"><a href="Chocolate.html">Chocolate</a></li><br> <li style="list-style-type: none;"><a href="Mallow.html">Marshmallows</a></li><br> <li style="list-style-type: none;"><a href="Gummy.html">Gummy Candy</a></li><br> <li style="list-style-type: none;"><a href="Seasonal.html">Seasonal Candy</a></li><br> <li style="list-style-type: none;"><a href="Fizzy.html">Fizzy Candy</a></li><br> <li style="list-style-type: none;"><a href="Lollipops.html">Lollipops</a></li><br> <li style="list-style-type: none;"><a href="Chewy.html">Chewy Candy</a></li><br> <li style="list-style-type: none;"><a href="HardBoiled.html">Hard Boiled Candy</a></li><br> <li style="list-style-type: none;"><a href="New.html">Newest Selection</a></li><br> </u1>

Answer 1

1. You have a typo, u1 instead of ul
2. You have too many definitions of A so the hover is ignored, I removed a { color: white; } a { color: white; }
3. Unnecessary inline list types on the LIs
4. Don't use float and br when not using float and br does the same. I removed li { float: left; } li { float: left; } and <br>

 ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #333; } li a { color: white; text-align: center; padding: 14px 16px; text-decoration: none; } li a:hover { color: red; }

 <ul> <li><a href="Chocolate.html">Chocolate</a></li> <li><a href="Mallow.html">Marshmallows</a></li> <li><a href="Gummy.html">Gummy Candy</a></li> <li><a href="Seasonal.html">Seasonal Candy</a></li> <li><a href="Fizzy.html">Fizzy Candy</a></li> <li><a href="Lollipops.html">Lollipops</a></li> <li><a href="Chewy.html">Chewy Candy</a></li> <li><a href="HardBoiled.html">Hard Boiled Candy</a></li> <li><a href="New.html">Newest Selection</a></li> </ul>