Question

嘿我在wordpress上做了一个菜单，但是它只悬停在边框底部而不是在单词上面时悬停并点击列表项的问题

的header.php

<?php
/**
 * The Header
 *
 * Displays all of the <head> section and everything up till <div id="main">
 *
 * @package Cryout Creations
 * @subpackage parabola
 * @since parabola 0.5
 */
 ?><!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<?php  cryout_meta_hook(); ?>
<meta http-equiv="Content-Type" content="text/html; charset=<?php bloginfo( 'charset' ); ?>" />
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php
    cryout_header_hook();
    wp_head(); ?>
</head>
<body <?php body_class(); ?>>

<?php cryout_body_hook(); ?>

<div id="wrapper" class="hfeed">

<?php cryout_wrapper_hook(); ?>

<div id="header-full">

<header id="header" >

<?php cryout_masthead_hook(); ?>
<div class="header_end">
<div class="header_bottom" >
        <div id="masthead" >
<ul id="branding" role="banner" >

            <li>    <?php cryout_branding_hook();?></li>
            <li>    <?php cryout_header_widgets_hook(); ?></li>



</ul>
<div class="menu_header">
<nav  role="navigation" #id="link-center">

                <?php cryout_access_hook();?>
            </nav><!-- #access -->
</div>
</div>


<br>
        </div><!-- #masthead --><br>

    <div style="clear:both;height:1px;width:1px;"> </div>
<div class="slideshow">
    <?php 
    echo do_shortcode("[metaslider id=5]"); 
?>
</div>
</header><!-- #header -->
</div><!-- #header-full -->
<div id="main">
    <div  id="forbottom" >
        <?php cryout_forbottom_hook(); ?>

        <div style="clear:both;"> </div>

        <?php cryout_breadcrumbs_hook();?>

菜单类的css部分：

.menu_header nav
{
    float:left;
        width: 714px;
    height: 53px;
    padding:0px;
    list-style:none;
        color: #d9d1c1;
        margin-left: 95px;

}

.menu_header ul li
{
    float:left;
           margin-top: -30px;


}

.menu_header ul li a
{
   float: left;
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
        color: #f1ec4b;
            font-size: 24px;
             padding-left: 9px;
    padding-right: 9px;
    margin-left: 9px;
       line-height: 30px;
           border-bottom: 3px solid #f1ec4b;


}

.menu_header ul li a:hover
{
    color: #fff;
}
.menu_header ul li:hover
{
    color: #fff;
}
.menu_header ul li a p {
    font-size: 24px;
    color: #f1ec4b;

}

当我试图删除链接的边框时链接已损坏，我不知道究竟是什么让只在边境上盘旋？

Answer 1

HTML结构和css代码是完全错误编写的，为了让你开始我已经直接修改了很多菜单以至少工作

＆＃13;

#branding {
width:200px;
}

.menu_header{
margin-left:0;
width: 724px;
margin-top: 80px;
}
.menu_header nav{
width:auto;
margin-left:0;
}
.header_end{
height:auto;
margin-top:0;
}
.menu_header ul li{
margin-top:0;
}

＆＃13;

请将此添加到文件的最后，显然它会改变外观，但是当html不牢固时，还有很多工作要做

徘徊在边界不在菜单上

1 个答案: