我自学了html和css,但我最近遇到的一个问题是用css修改链接。我以前做过这件事,很多时候没有任何错误,但现在我能想到的所有方式以及我在互联网上找不到的任何方式。
我尝试了所有这些方法,但都没有效果:
a.linkclass:link{text-decoration:none;}
.linkclass a:link{text-decoration:none;}
#linkid a:link{text-decoration:none;}
a#linkid:link{text-decoration:none;}
我的html和css如下(经过反复观察,我发现可能导致这些问题的不对错)
body{
margin:0;
background-color:eaf7ff;
}
#menubar{
max-height:10%;
min-height:3%
height:5%;
background-color:BBBBBB;
border-bottom:1px solid black;
max-width:100%;
min-width:100%;
width:100%;
float:left;
position:fixed;
display:inline-block
}
#pushbox{
max-height:10%;
height:10%;
background-color:black;
max-width:100%;
min-width:100%;
width:100%;
}
#box1{
background-color:eaf7ff;
}
#tag1{
background-color:eaf7ff;
margin:0;
}
#box2{
background-color:fff7ea;
}
#tag2{
background-color:eaf7ff;
margin:0;
}
#box3{
background-color:eaf7ff;
}
#tag3{
background-color:eaf7ff;
}
#box4{
background-color:fff7ea;
}
#tag4{
background-color:eaf7ff;
}
#box5{
background-color:eaf7ff;
}
#tag5{
background-color:eaf7ff;
}
#copyright{
}
.content{
max-width:100%;
min-width:100%;
width:100%;
min-height:80%;
height:85%;
}
.contenttag{
max-height:10%;
height:10%;
max-width:100%;
min-width:100%;
width:100%;
}
a.menulink{
border:1px solid black;
background-color:red;
}
a:link {
text-decoration: none;
color:black;
}
a:visited {
text-decoration: none;
color:black;
}
a:hover {
text-decoration: none;
color:black;
}
a:active {
text-decoration: none;
color:black;
}
<html>
<head>
<link rel="stylesheet" type="text/css" href="main.css">
</head>
<body>
<!-- ==========MENUBAR==========-->
<div id='menubar'>
<h1>
<a href='#tag1' class='menulink'>OPT1</a>
<a href='#tag2' class='menulink'>OPT2</a>
<a href='#tag3' class='menulink'>OPT3</a>
<a href='#tag4' class='menulink'>OPT4</a>
<a href='#tag5' class='menulink'>OPT5</a>
</h1>
</div>
<!-- ==========CONTENTBOX1==========-->
<div id='tag1' class='contenttag'></div>
<div id='box1' class='content'>
<h1>ContentBox1</h1>
</div>
<!-- ==========CONTENTBOX2==========-->
<div id='tag2' class='contenttag'></div>
<div id='box2' class='content'>
<h1>ContentBox2</h1>
</div>
<!-- ==========CONTENTBOX3==========-->
<div id='tag3' class='contenttag'></div>
<div id='box3' class='content'>
<h1>ContentBox3</h1>
</div>
<!-- ==========CONTENTBOX4==========-->
<div id='tag4' class='contenttag'></div>
<div id='box4' class='content'>
<h1>ContentBox4</h1>
</div>
<!-- ==========CONTENTBOX5==========-->
<div id='tag5' class='contenttag'></div>
<div id='box5' class='content'>
<h1>ContentBox5</h1>
</div>
<!-- ==========COPYRIGHT==========-->
<div id='copyright'><center>
copyright © Vladimir Plenskiy <?php echo date("Y"); ?>, Template by Timothy Leitzke
</center>
</div>
</body>
</html>
'a.menulink'本身不起作用。(对不起,如果这令人困惑,目前是12:14 AM,我也一直在Unity工作,过去24年我的计算机上有一些艺术品+小时)
- edit-- 对于那些不明白我的问题的人,即使格式是正确的。使用类和id的CSS样式不起作用(我尝试的示例都在第一个css样式表中。该样式表不是在页面中使用的样式表,如标题中所示,仅使用ONE)
答案 0 :(得分:-2)
根据您的HTML,您的链接的CSS应该是:
.menulink:link {text-decoration:none;}