Question

我正在使用wordpress构建自定义网站。在我的CSS中，除了活动状态之外，我能够为我的主导航设置所有样式。除了在悬停时加下划线的导航项之外，我希望当您在所选页面上时，它会加下划线。我似乎无法弄清楚我的代码中出了什么问题。

CSS

body {
background:#cfcfcf;
padding:0px;
margin:0px;
}

#content {
font-size:14px;
font-family:Arial, Sans-Serif;
}

#box {
background:white;
width:824px;
min-height:650px;
margin:auto;
}

#copy {
width:520px;
float:left;
margin-top:0px;
}

#form {
width:235px;
margin-right:20px;
float:right;
}

/*header---------------------------------------------------------------------*/

#header {
width:auto;
margin-left:auto;
margin-right:auto;
margin-bottom:0px;
margin-top:0px;
background: transparent no-repeat;
}

#logo{
background: transparent url("http://ahsvegas.com/wp-content/uploads/2015/11/AHS_Vegas_Logo.png") no-repeat;
width:475px;
height:130px;
overflow:hidden;
margin-left:auto;
margin-right:auto;
margin-bottom:35px;
margin-top:80px;
}

/* Pages Nav---------------------------------------------------------------------*/

#topbg {
margin:auto;
padding:0;
overflow:hidden;
background-color:#07094b;
position:absolute;
top:0;
width:100%;
height:70px;
}

#navmenu {
width:784px;
margin:0px auto;
}

#navmenu ul {
list-style-type: none;
display: inline-block;
float:left;
margin:0;
padding:0;
}

#navmenu li {
display:inline-block;
}

#navmenu ul li a {
display:inline-block;
color: white;
font-size:18px;
font-family:Arial, Sans-Serif;
padding:24px 32px 0px 0px;
text-decoration: none;
}

#navmenu ul li a:hover {
text-decoration:underline;
}

#navmenu ul li a:active {
text-decoration:underline;
}

#social {
padding:6px 0px 0px 0px;
float:right;
}

/*post------------------------------------------------------------*/
.post {
color:#000000;
padding:5px 20px;
margin-top:-6px;
}

h1 {
color:#000000;
font-family:Helvetica, Sans-Serif;
font-size: 24px;
text-decoration:none;
margin-top:10px;
}

h3 {
color:#000000;
font-size: 16px;
text-decoration:none;
}

.entry {
color:#000000;
padding:0px 20px 0px 20px;
}

.entrytext {
}

.pagetitle {
}

/*links------------------------------------*/

a {
color:#07094b;
font-size: 13px;
text-decoration:underline;
padding: 0px; 
}

a:hover {
color:#000000;
text-decoration:underline;
}

/*Misc -----------------------------------*/

a img {
border:0px;
}

img {
border:0px;
}

.description {
padding:0 5px 15px 5px;
}

.hp-wrap {
    display: none;
}

/*footer---------------------------------------*/

footer {
font-family:Arial, Sans-Serif;
text-align:center;
font-size: 12px;
color:#000000;
background:#ffffff;
padding-top: 20px;
padding-bottom: 20px;
margin: 0px auto;
width:824px;
}

footer a {
font-size: 12px;
color:#000000;
text-decoration:none;
}

footer a:hover {
color:#07094b;
text-decoration:underline;
}

标题PHP：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head profile="http://gmpg.org/xfn/11">

<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />

<meta name="distribution" content="global" />

<meta name="robots" content="follow, all" />

<meta name="language" content="it, en" />

<title><?php wp_title(''); ?><?php if(wp_title('', false)) { echo ' :'; } ?> <?php bloginfo('name');  ?></title>

<meta name="generator" content="HandymanLasVegas<?php bloginfo('version'); ?>" />


<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />

<link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" />

<link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" />

<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />

<?php wp_get_archives('type=monthly&format=link'); ?>

<!--[if lt IE 7.]>
<script defer type="text/javascript" src="pngfix.js"></script>
<![endif]-->

<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/prototype.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/scriptaculous.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/combo.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/lightbox.js"></script>


<?php wp_head(); ?>
<style type="text/css" media="screen">
<!-- @import url( <?php bloginfo('stylesheet_url'); ?> ); -->
</style>
</head>
<body>     

<div id="header">

<div id="topbg">

<div id="navmenu">
        <?php wp_nav_menu( array( 'theme_location' => 'header-menu' ) ); ?>
<div id="social">

<a href="https://www.facebook.com/American-Handyman-Services-Inc-259437720757501/timeline" target="_blank"><img src="http://ahsvegas.com/wp-content/uploads/2015/12/AHS_Facebook.png" width="55" height="55" /></a>
<a href="mailto:test@test.com"><img src="http://ahsvegas.com/wp-content/uploads/2015/12/AHS_Email.png" width="55" height="55"/></a>

</div>  

</div>     

</div>

    <a title="Home" href="http://www.ahsvegas.com"><div id="logo" style="cursor: pointer;"></div></a>
</div>

<div id="box"> 


<!-- end header -->

Answer 1

Wordpress正在添加课程＆＃39; current_page_item＆＃39;在li上，所以在你的CSS中使用#navmenu ul li. current_page_item a而不是#navmenu ul li a:active

无法在导航

1 个答案: