ホームページ  >  記事  >  ウェブフロントエンド  >  質問があります: ul li と書かれたナビゲーション バーにドロップダウン メニューが表示されないのはなぜですか? 皆さんありがとう_html/css_WEB-ITnose

質問があります: ul li と書かれたナビゲーション バーにドロップダウン メニューが表示されないのはなぜですか? 皆さんありがとう_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:34:351480ブラウズ

CSS コード:

* {
margin:0;
パディング:0;
リストスタイル:なし;
}
本文{
背景:#f0f0f0;
カラー:#999;
フォントサイズ:12px; 
フォントファミリー:「Lucida Grande」、Arial、サンセリフ;
行の高さ:1.5em;
オーバーフロー-y:auto;
オーバーフロー-x:自動;
}
img {
border:0;
}
a {
color:write;text-decoration:none;
bblr:expression(this.onFocus=this.blur()); 
概要:なし。 
}
li {list-style:none;}

.logo_box{ width:399px; 高さ:100ピクセル; align:left;float:left;}
.logo_box a{font-size:1.2em;Line-height:1.8em}
.top_right{ width:500px; float:right;}
.hydl_box{ width:500px; テキスト整列:右; 高さ:12ピクセル; 行の高さ:12px;  color:#999999;}
.hydl_box a{color:#999999;}


.clearfix:after {
content:".";
表示:ブロック;
高さ:0;
クリア:両方;
可視性:非表示;
}
.topNav {
位置:相対; 
z インデックス:1;
高さ:40ピクセル;
行の高さ:40px;
背景: url(../images/nav_bg.JPG) repeat-x 左上;
フォントファミリー:「Lucida Grande」、Arial、サンセリフ;
フォントサイズ:12px;
}
.topNav-width {
width:1640PX;
高さ:40ピクセル;
マージン:0 自動;
}
.topNav h3 {
font-weight:normal;
フォントサイズ:12px;

}
.topNav .tnLeft {
float:left; ;
}
.topNav li {
float:left;
位置:相対的; 
}
.topNav li h3 {
float:center;
フォントの太さ:標準;
フォントサイズ:12px;
}
.topNav li h3 a {
display:inline-block;
*表示:インライン;
ズーム:1;
フォントサイズ:12px;
高さ:14ピクセル;
行の高さ:14px;
パディング:13px 20px;
color:white
}
.topNav li h3 a i {
display:inline-block;
幅:8ピクセル;
高さ:5ピクセル;
余白:0 0 0 5px;
オーバーフロー:非表示;
垂直配置:中央;
フォントサイズ:12px;
行の高さ:13px;
背景:url(images/nav_bg.JPG) 0 -61px 繰り返しなし;
}
.topNav li h3 a:hover,.topNav li.on h3 a {
background:#1C86EE;

}
.topNav .welcome {
padding-right:15px;
色:白;
}
.topNav .welcome a {
color:white;
}
.topNav li ul {
表示:なし;
位置:相対的; 
左:0;
ボーダー:1px solid #CDC9C9;
ボーダートップ:0;
背景:#1C86EE;
-moz-box-shadow:3px 3px 3px rgba(0,0,0,.1);
-webkit-box-shadow:3px 3px 3px rgba(0,0,0,.1);
box-shadow:3px 3px 3px rgba(0,0,0,.1);
}
.topNav li ul li {
line-height:31px;
}
.topNav li ul li a {
display:block;
色:白;
パディング:0 15px;
}
.topNav li ul li a:hover {
background:#CFCFCF;
色:白;
}
.topNav li ul li a span {
color:white;
margin-left:5px;
}
/*
.body{
位置:相対;
}
*/
.foot_box{ width:100%; 背景:url(../images/foot_bg_03.jpg) repeat-x; 高さ:36px;}
.foot_con{ 幅:1000px; マージン:0 自動; テキスト整列:右; 色:#FFF; 高さ:32ピクセル; line-height:32px;}HTML コード:
3f2bc615c447ceb20c4f69214f914370
ee93f28997d9bb9bc4b6e12eabc2ce1e
b2386ffb911b14667cb8f0f91ea547a7指標レポート6e916e0f7d1e588d4f442bf645aedb2f
99d9f8c0b1d838eeb9ddd53d0bc7b3742cacc6d41bbb37262a98f745aa00fbf0
56c6fd97ed3d2a5896927586fb5e590b2cacc6d41bbb37262a98f745aa00fbf0
a586015c911220733e5a6cecfcc3f07b
ab8b027330d8b8895c8a924a289d06d3
a3f7994505de499329818f341982b699
90c3c1b8a35e47ef2eeea6dfa4ae2794

MXAIS レポート システム


3499910bf9dac5ae3c52d5ede7383485指標ステータスの表示|レポートの実行|データの追加|ユーザーの追加5db79b134e9f6b82c0b36e0489ee08ed
16b28748ea4df4d9c2150843fecfba68
779ac1cc2ca7ab2eb4b256d821963493
365c8bba28da69aab9810dbed4f079fd
5c2797f5f460d709775ffb3fc6183472ログイン5db79b134e9f6b82c0b36e0489ee08ed    |    e196f417828d78ca4f176f37bc582b3aサインイン5db79b134e9f6b82c0b36e0489ee08ed    |    2eae94b1dc31c7c78b4e98f47e3fe45f 米国について63505a6f727f70c8bd4066f3066dcb9d
16b28748ea4df4d9c2150843fecfba68
16b28748ea4df4d9c2150843fecfba68
16b28748ea4df4d9c2150843fecfba68
4aabfb974848644f8c57a8838482a1f4
753f75a9b9aa6239f7d251a040923e2c
f43f6bfe8855f6fd4dc8d882ab673d62
ff6d136ddc5fdfeffaf53ff6ee95f185
25edfb22a4f469ecb59f1190150159c6684271ed9684bde649abda8831d4d35556cf77591b357eedb7af8f2618f3debeホーム ページ5db79b134e9f6b82c0b36e0489ee08ed39528cedfa926ea0c01e69ef5b2ea9b0bed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6684271ed9684bde649abda8831d4d3553499910bf9dac5ae3c52d5ede7383485レポート管理5db79b134e9f6b82c0b36e0489ee08ed39528cedfa926ea0c01e69ef5b2ea9b0
ff6d136ddc5fdfeffaf53ff6ee95f185
25edfb22a4f469ecb59f1190150159c685bb2c0cf4448a8c24761923f076a9a3毎週5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6fb56c40e78285f5e7fb83aa559fa8f7f毎月5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
bed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6
684271ed9684bde649abda8831d4d35507937f813902298766910fd8a6f59656データ管理5db79b134e9f6b82c0b36e0489ee08ed39528cedfa926ea0c01e69ef5b2ea9b0
ff6d136ddc5fdfeffaf53ff6ee95f185
25edfb22a4f469ecb59f1190150159c6fca7400520627cbbe2119d180d8e36f6毎週5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6fca7400520627cbbe2119d180d8e36f6毎月5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c67ee6758518ba6e13e0e9aa95569666bd生データ5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
bed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6


360485f6c4bab5626c720f6d5281e062指標管理5db79b134e9f6b82c0b36e0489ee08ed
39528cedfa926ea0c01e69ef5b2ea9b0
bed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6


4227ee453352e31cb9dcf5e34ce3b6a2ユーザー管理5db79b134e9f6b82c0b36e0489ee08ed
39528cedfa926ea0c01e69ef5b2ea9b0
bed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
16b28748ea4df4d9c2150843fecfba68
16b28748ea4df4d9c2150843fecfba68
16b28748ea4df4d9c2150843fecfba68
9c2001b4d8e0753b2ecfc842ac1a57cf16b28748ea4df4d9c2150843fecfba68
4ec11beb6c39d0703d1751d203c17053jQuery(".topNav").slide({ type:"menu", titCell:"dd", targetCell:"ul", layTime:0,defaultPlay:false, returnDefault:true }); fa53fefa8eafc7c836ea46f2cc284f0d
108ceab55c7120d64d3e13b8c9592aa916b28748ea4df4d9c2150843fecfba68

73a6ac4ed44ffec12cee46588e518a5e


返し讨论(解決案)

问题比多、一列举、仅提供。
1. js で使用される方法には問題があり、不正な登録が行われています。 li、または子コレクション上で少标志クラス。 

//    jQuery(".topNav").slide({ type:"menu",  titCell:"dd", targetCell:"ul", delayTime:0,defaultPlay:false,returnDefault:true  }); jQuery(".topNav").slide({ type:"menu",  titCell:".m", targetCell:".sub", effect:"slideDown", delayTime:300, triggerTime:100,returnDefault:true  });

最後に完全な html
<ul>                <li class="m"><h3><a href="main.jsp">Home Page</a></h3></li>                <li class="m"><h3><a>Report Management</a></h3>                    <ul class="sub">                        <li><a href="../jsp/getsmetricreport">Weekly</a></li>                        <li><a href="../jsp/getsmetricreportmonth">Monthly</a></li>                    </ul>


コンテンツが写っていない原因である可能性があります。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。