我正在 Wordpress 中制作一个网站，有一点我需要使用下拉菜单来选择不同的选项。我不知道我做错了什么，老实说，我真的不知道我在做什么。有问题的站点是:
http://www.lukegartland.com/final/
如您所见，有一个您实际上无法点击的下拉菜单。但是，当您按几次 TAB 键并按空格键时，它会打开菜单。我将链接到下面页面的源代码。
<?php
/**
* The Header for our theme.
*
* Displays all of the <head> section and everything up till <main>
* and the left sidebar conditional
*
* @since 1.0.0
*/
?><!DOCTYPE html>
<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7" <?php language_attributes(); ?>><![endif]-->
<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8" <?php language_attributes(); ?>><![endif]-->
<!--[if IE 8]><html class="no-js lt-ie9" <?php language_attributes(); ?>><![endif]-->
<!--[if gt IE 8]><!--><html class="no-js" <?php language_attributes(); ?>><!--<![endif]-->
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php wp_title( '|', true, 'right' ); ?></title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<!--[if IE]><script src="<?php echo BAVOTASAN_THEME_URL; ?>/library/js/html5.js"></script><![endif]-->
<?php wp_head(); ?>
</head>
<?php
$bavotasan_theme_options = bavotasan_theme_options();
$space_class = '';
?>
<body <?php body_class(); ?>>
<div id="page">
<header id="header">
<nav id="site-navigation" class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<h3 class="sr-only"><?php _e( 'Main menu', 'arcade' ); ?></h3>
<a class="sr-only" href="#primary" title="<?php esc_attr_e( 'Skip to content', 'arcade' ); ?>"><?php _e( 'Skip to content', 'arcade' ); ?></a>
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse">
<?php
$menu_class = ( is_rtl() ) ? ' navbar-right' : '';
wp_nav_menu( array( 'theme_location' => 'primary', 'container' => '', 'menu_class' => 'nav navbar-nav' . $menu_class, 'fallback_cb' => 'bavotasan_default_menu', 'depth' => 2 ) );
?>
</div>
</nav><!-- #site-navigation -->
<div class="title-card-wrapper">
<div class="title-card">
<div id="site-meta">
<p style="display: inline-block; color: #fff; background-color: #fff; width: 45%; height: 200px; border-radius: 5px; margin: 1em; box-shadow: 0px 4px 11px #000; font-size: font-family: 'Roboto Condensed'; font-size: 22px;
color: #464549;"> // Start of Box
</br></br></br></br>Please select your location:
<h1 style="margin-top: -42%;"><img src="http://lukegartland.com/mykids/wp-content/uploads/2014/11/LogoImagesmall.png"></h1>
// The following is the dropdown in question
<select id="foo">
<option value="#">-</option>
<option value="http://www.lukegartland.com/final/map">Maynooth</option>
<option value="http://www.lukegartland.com/final/map">Celbridge</option>
<option value="http://www.lukegartland.com/final/map">Leixlip</option>
<option value="http://www.lukegartland.com/final/map">Dublin</option>
</select>
<script>
document.getElementById("foo").onchange = function() {
if (this.selectedIndex!==0) {
window.location.href = this.value;
}
};
</script>
</p>
<h1 id="site-title">
<a href="<?php echo esc_url( home_url() ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a>
</h1>
<?php if ( $bavotasan_theme_options['header_icon'] ) { ?>
<i class="fa <?php echo $bavotasan_theme_options['header_icon']; ?>"></i>
<?php } else {
$space_class = ' class="margin-top"';
} ?>
<div id="sitedescript"<?php echo $space_class; ?>>
<?php bloginfo( 'description' ); ?>
</div>
</div>
<?php
// Header image section
bavotasan_header_images();
?>
</div>
</div>
</header>
<main>最佳答案
你的 h1 标签有巨大的 padding-bottom 并且它覆盖了选择框移除那个 padding
h1#site-title {padding-bottom:13%;}
在 style.css 文件中
关于php - Wordpress 中损坏的下拉菜单，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27219497/