1

我目前正在使用 CSS 来更改左侧导航中的超链接颜色,但似乎有些不一致。一些链接将采用我声明的正确属性,而其他链接将不接受它们。我已经class nav对所有链接声明了相同的内容。我知道这些链接没有任何覆盖,因为它是孤立的。

下面是左侧导航代码片段

这有效:

var context='<%=request.getContextPath()%>';
<%--    var sOrg = '<%=sOrg%>'; --%>
document.write("<div id=\"leftNav\">");
document.write("<div id=\"leftNavtext\"><a href=\"home.htm?sOrg="+'<%=sOrg%>'+"\" class=\"nav\" id=\"phome\" style=\"text-decoration:none\" >Home</a></div>");

然后这不起作用:

  <% if(roles.contains("PEIMSDataCompleter")) {  %>
document.write("<div id=\"leftNavtext\" ><a href=\"dataSubmissions.jsp\" class=\"nav\" id=\"dataSubmissions\" style=\"text-decoration:none\">Data Submissions</a></div>");

然后这个工作:

document.write("<div  style=\" padding-left: 20px;padding-top:5px;\"><a href=\"scheduleMonitor.htm\" class=\"nav\" id=\"scheduleMonitor\" style=\"text-decoration:none\">Monitor Data Loads</a></div>");

这是我的CSS:

#leftNav {
width:180px;
height:687px;
background-color:#E0F0F2;
margin-bottom:15px;
padding-left:10px;
text-decoration:none;
text-color: #0083cc;
}

#leftNavtext {
font-family: Arial, Helvetica, sans-serif; font-weight:800;
font-size:95%;
color:#0083cc;
width:auto;
padding: 20px 10px 3px 0px;



}

#noteBody{
font-family: Arial, Helvetica, sans-serif; font-weight:800;
font-size:95%;
width:960px;
margin:auto;

}

// Below is the code for getting the hyperlink text to be formatted correctly (ie link colors)
a.nav:link {color: #0083cc; text-decoration: none; }
a.nav:visited {color: #0083cc; text-decoration: none; }
a.nav:hover {color: orange; text-decoration: underline; }
a.nav:active {color: #0083cc; }

据我所知,这两个链接之间没有区别。这些只是我在左侧导航中的众多链接中的一小部分,这是随机发生的。我目前使用的是 IE 9,这个浏览器是我的要求。

任何帮助将不胜感激!谢谢!

4

3 回答 3

2

您是否格式化了所有 :pseudo 声明的锚?

a, a:link, a:visited {some.css}
a:hover, a:visited:hover, a:active, a:focus {some-other.css}

也许您正在查看特定于浏览器的样式。

于 2013-02-11T18:05:41.277 回答
2

首先,

  • text-color属性不存在;改为使用color
  • 如果您使用的是 ASP(似乎是),请在您的问题中添加适当的标签

接下来,问题不在于您的 CSS ;在这里看到这个小小的 JSFiddle:http: //jsfiddle.net/j8ruV/2/

事实是您正在使用 document.write() 方法向页面动态添加对象,但是此方法将您divs奇怪地添加到 DOM 中,因此 CSS 不考虑它们(内联对象除外)。通过简单地测试该.innerHTML属性,这似乎有效(参见小提琴)。

于 2013-02-11T18:27:53.263 回答
0

我最终不得不为链接放置内联代码:

document.write("<div id=\"leftNavtext\" ><a href=\"dataSubmissions.jsp\" class=\"nav\" id=\"dataSubmissions\" style=\"text-decoration:none; color:#0083cc;\">Data Submissions</a></div>");

于 2013-02-11T23:38:07.980 回答