我使用 CSS 为包含链接的菜单创建样式,但现在该样式适用于页面上的所有链接。我如何禁用某些链接的 css 样式?这是CSS代码:
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
}
li {
font-size: 35px;
display: inline-block;
}
a:link, a:visited {
display: block;
width: 250px;
font-weight: bold;
color: #FFFFFF;
background-color: #0080FF;
text-align: center;
padding: 4px;
text-decoration: none;
text-transform: uppercase;
}
a:hover, a:active {
background-color: #66B2FF;
}
这是 html 代码(这是一个画廊):
<html>
<head>
<title>GALLERY</title>
<link rel="stylesheet" type="text/css" href="styles.css">
<script type="text/javascript" language="JavaScript">
</script>
</head>
<body>
<center><br/>
<font face="Geneva" id="title">GALLERY</font><br/><br/><br/>
</center>
<center>
<ul>
<li><a href="index.html">home</a></li>
<li><a href="about.html">about</a></li>
<li><a href="gallery.html">gallery</a></li>
<li><a href="contact.html">contact</a></li>
</ul><br/><br/><br/>
<table border="1">
<tr>
<td><a href="pictures/gallery/pic1.jpg" target="_blank"><img src="pictures/gallery/pic1.jpg" width="450" height="253"/></a></td>
<td><a href="pictures/gallery/pic2.jpg" target="_blank"><img src="pictures/gallery/pic2.jpg" width="450" height="253"/></a></td>
<td><a href="pictures/gallery/pic3.jpg" target="_blank"><img src="pictures/gallery/pic3.jpg" width="450" height="253"/></a></td>
<td><a href="pictures/gallery/pic4.jpg" target="_blank"><img src="pictures/gallery/pic4.jpg" width="450" height="253"/></a></td>
<tr>
<tr>
<td><a href="pictures/gallery/pic5.jpg" target="_blank"><img src="pictures/gallery/pic5.jpg" width="450" height="253"/></a></td>
<td><a href="pictures/gallery/pic6.jpg" target="_blank"><img src="pictures/gallery/pic6.jpg" width="450" height="253"/></a></td>
<td><a href="pictures/gallery/pic7.jpg" target="_blank"><img src="pictures/gallery/pic7.jpg" width="450" height="253"/></a></td>
<td><a href="pictures/gallery/pic8.jpg" target="_blank"><img src="pictures/gallery/pic8.jpg" width="450" height="253"/></a></td>
<tr>
<tr>
<td><a href="pictures/gallery/pic9.jpg" target="_blank"><img src="pictures/gallery/pic9.jpg" width="450" height="253"/></a></td>
<td><a href="pictures/gallery/pic10.jpg" target="_blank"><img src="pictures/gallery/pic10.jpg" width="450" height="253"/></a></td>
<td><a href="pictures/gallery/pic11.jpg" target="_blank"><img src="pictures/gallery/pic11.jpg" width="450" height="253"/></a></td>
<td><a href="pictures/gallery/pic12.jpg" target="_blank"><img src="pictures/gallery/pic12.jpg" width="450" height="253"/></a></td>
<tr>
<tr>
<td><a href="pictures/gallery/pic13.jpg" target="_blank"><img src="pictures/gallery/pic13.jpg" width="450" height="253"/></a></td>
<td><a href="pictures/gallery/pic14.jpg" target="_blank"><img src="pictures/gallery/pic14.jpg" width="450" height="253"/></a></td>
<td><a href="pictures/gallery/pic15.jpg" target="_blank"><img src="pictures/gallery/pic15.jpg" width="450" height="253"/></a></td>
<td><a href="pictures/gallery/pic16.jpg" target="_blank"><img src="pictures/gallery/pic16.jpg" width="450" height="253"/></a></td>
<tr>
</table>
</center>
</body>
</html>
因此表格中的所有链接都使用了 css 中的样式。我该如何阻止它?提前致谢。
最佳答案
使用 CSS 特定的选择器:
ul{
//CSS for ul
}
ul li{
//CSS for li
}
ul li a{
//add CSS for nav links
}
关于html - 禁用某些元素的 css 样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30954603/