如何禁止CSS菜单覆盖标准HTML链接？
我用CSS创建了一个菜单，下面有一个使用a href标记的HTML链接。然而，链接不是蓝色或带下划线的，它的外观和悬停方式与我使用CSS为菜单创建的链接完全相同。此外，无论我是否在希望标记出现的文本之后键入标记，该链接都会向左移动 下面是代码的样子：如何禁止CSS菜单覆盖标准HTML链接？,html,css,inheritance,overriding,parent,Html,Css,Inheritance,Overriding,Parent,我用CSS创建了一个菜单，下面有一个使用a href标记的HTML链接。然而，链接不是蓝色或带下划线的，它的外观和悬停方式与我使用CSS为菜单创建的链接完全相同。此外，无论我是否在希望标记出现的文本之后键入标记，该链接都会向左移动 下面是代码的样子： <!DOCTYPE html> <html> <head> <style> ul { float:left;position:relative;width:40%;padding:0;margin:
<!DOCTYPE html>
<html>
<head>
<style>
ul
{
float:left;position:relative;width:40%;padding:0;margin:0;list-style-type:none;
}
a
{
float:left;width:5em;text-align:center;text-decoration:none;color:black;background-color:#c0c0c0;padding:0.2em 0.5em;
}
a:hover {background-color:#d0d0d0;}
li {display:inline}
</style>
</head>
<div>
<ul>
<li><a href="#">HOME</a></li>
<li><a href="#">SERVICES</a></li>
<li><a href="#">GALLERY</a></li>
<li><a href="#">CONTACT</a></li>
</ul>
</div>
<br>
<br>
To see a picture of Curious George, click <a href="http://cdn.mhpbooks.com/uploads/2012/05/Curious_Georg.jpg">this link</a>
</html>
保险商实验室
{
浮动：左侧；位置：相对；宽度：40%；填充：0；边距：0；列表样式类型：无；
}
A.
{
浮动：左侧；宽度：5em；文本对齐：居中；文本装饰：无；颜色：黑色；背景颜色：#C0C0；填充：0.2em 0.5em；
}
a:悬停{背景色：#d0d0；}
li{display:inline}
要查看好奇的乔治的照片，请单击
任何帮助都将不胜感激。本周我刚开始学习HTML/CSS。改变你的风格，以利用特殊性：
<style>
ul {
float:left;position:relative;width:40%;padding:0;margin:0;list-style-type:none;
}
ul li a {
float:left;width:5em;text-align:center;text-decoration:none;color:black;background-color:#c0c0c0;padding:0.2em 0.5em;
}
ul li a:hover { background-color:#d0d0d0; }
li { display:inline }
</style>
保险商实验室{
浮动：左侧；位置：相对；宽度：40%；填充：0；边距：0；列表样式类型：无；
}
ullia{
浮动：左侧；宽度：5em；文本对齐：居中；文本装饰：无；颜色：黑色；背景颜色：#C0C0；填充：0.2em 0.5em；
}
ul li a：悬停{背景色：#d0d0；}
li{display:inline}
这里有一个链接，指向有关此的更多信息：更改样式以利用特定性：
<style>
ul {
float:left;position:relative;width:40%;padding:0;margin:0;list-style-type:none;
}
ul li a {
float:left;width:5em;text-align:center;text-decoration:none;color:black;background-color:#c0c0c0;padding:0.2em 0.5em;
}
ul li a:hover { background-color:#d0d0d0; }
li { display:inline }
</style>
保险商实验室{
浮动：左侧；位置：相对；宽度：40%；填充：0；边距：0；列表样式类型：无；
}
ullia{
浮动：左侧；宽度：5em；文本对齐：居中；文本装饰：无；颜色：黑色；背景颜色：#C0C0；填充：0.2em 0.5em；
}
ul li a：悬停{背景色：#d0d0；}
li{display:inline}
这里有一个链接，指向有关此的更多信息：您需要更具体地使用css规则。因为它是现在，它适用于所有添加和id为您的菜单或类似的东西
#menu a {
some css here
}
您需要更具体地使用css规则。因为它是现在，它适用于所有添加和id为您的菜单或类似的东西
#menu a {
some css here
}
你真棒！非常感谢你！当然可以CSS是一个非常简洁的工具，但有时会让人困惑呵呵,对。第一天看的时候，我就不知所措，甚至做噩梦，哈哈。但我喜欢每个人的帮助@虽然这解决了你的问题，但我建议你考虑GuiGreg的答案，因为它教你更好地组织css。你太棒了！非常感谢你！当然可以CSS是一个非常简洁的工具，但有时会让人困惑呵呵,对。第一天看的时候，我就不知所措，甚至做噩梦，哈哈。但我喜欢每个人的帮助@Sweersz虽然这解决了你的问题，但我建议你考虑GuiGreg的答案，因为它教你更好地组织css。谢谢提示：-）谢谢提示：-）ul，足以回答这个问题；）是的，但如果他以后需要另一个ul，这将导致另一个问题。尽管如此，它不会在其他任何地方设置链接：）我更喜欢这个答案，因为它教你使用id/类来组织css，而不是元素的随机嵌套，正如所述，这可能会导致其他地方无意中获得你不想要的样式。ul，足够适合这个问题；）是的，但如果他以后需要另一个ul，这将导致另一个问题。尽管如此，它不会在其他任何地方设置链接样式：）我更喜欢这个答案，因为它教导使用id/类来组织css，而不是元素的随机嵌套，正如所述，这可能会导致其他地方无意中获得您不想要的样式。