我正在开发一个响应式布局,它有两种不同的菜单布局,标准和移动。我似乎无法在主(第二)导航菜单中的当前页面链接上更改字体颜色。我可以设置当前/活动页面的背景,它可以在两个菜单中工作;但是当我更改字体/链接颜色时,它只会在移动菜单中更改。我已经搜索过,似乎无法找到发生这种情况或解决方案的原因。
以下是页面:http://www.newmanlandscaping.com/index2.php
这是样式表:http://www.newmanlandscaping.com/nlstyle.css
感谢您的关注, 汤姆
#home .home a:link, #home .home a:visited,#home .home a:hover, #home .home a:active,
#contact .contact a:link, #contact .contact a:visited, #contact .contact a:hover, #contact .contact a:active,
#photos .photos a:link, #photos .photos a:visited, #photos .photos a:hover, #photos .photos a:active,
#services .services a:link, #services .services a:visited, #services .services a:hover, #services .services a:active{ <br>
font-weight: bold;
background-color: green; /*This changes the background link color to display the current page. Works in both menus. */
color: white; /* This changes the link font color of the current page in the menu. This only changes on the mobile menu. */
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
答案 0 :(得分:1)
使用“!important”关键字,以便不会覆盖其他关键字。
#home .home a:link, #home .home a:visited, #home .home a:hover, #home .home a:active, #home .home .mainheader nav a:link, #home .home .mainheader nav a:visited, #home .home .mainheader nav a:hover, #home .home .mainheader nav a:active, #contact .contact a:link, #contact .contact a:visited, #contact .contact a:hover, #contact .contact a:active, #photos .photos a:link, #photos .photos a:visited, #photos .photos a:hover, #photos .photos a:active, #services .services a:link, #services .services a:visited, #services .services a:hover, #services .services a:active
{
font-weight: bold;
background-color: green; /*This changes the background link color to display the current page. Works in both menus. */
color: white !important; /* This changes the link font color of the current page in the menu. This only changes on the mobile menu. */
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}