ホームページ  >  記事  >  ウェブフロントエンド  >  CSS についてはあまり詳しくありません。垂直 CSS メニューを作成するときにブロック非表示を使用しましたが、水平メニューについてはよくわかりません。どなたか、answer_html/css_WEB-ITnose を教えてください。

CSS についてはあまり詳しくありません。垂直 CSS メニューを作成するときにブロック非表示を使用しましたが、水平メニューについてはよくわかりません。どなたか、answer_html/css_WEB-ITnose を教えてください。

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

先把纵向菜单的导航代码发出来
--------------------------------------------------------
b585974ae3b7dba3039af53a9593f9c4
383eb734b02b508089ba2d78eb4c6f68
93f0f5c25f18dab9d176bd4f6de5d30e
ebeda52af7641f7e715679a8472f8c69
b2386ffb911b14667cb8f0f91ea547a7无标题文档6e916e0f7d1e588d4f442bf645aedb2f
69ead60f4f5bd2999ab42bf5dc6cf1d1
9c3bca370b5104690d9ef395f2c5f8d1

6c04bd5ca3fcae76e30b72ad730ca86d
ef9cd36823c0f633bcf49bb63c0aa8b9
ff6d136ddc5fdfeffaf53ff6ee95f185
25edfb22a4f469ecb59f1190150159c6
f1b3ba8846c179e65eb68da95b01a812中国5db79b134e9f6b82c0b36e0489ee08ed
ff6d136ddc5fdfeffaf53ff6ee95f185
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812唐朝5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812宋朝5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812汉朝5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812元朝5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812明朝5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812清朝5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
bed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812俄罗斯5db79b134e9f6b82c0b36e0489ee08ed
ff6d136ddc5fdfeffaf53ff6ee95f185
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812彼得大帝5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812沙皇5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812叶卡捷莉娜二世5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
bed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812马来西亚5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812美国5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812印度5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812日本5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812泰国5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6f1b3ba8846c179e65eb68da95b01a812法国5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
16b28748ea4df4d9c2150843fecfba68
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e
----------------------纵向菜单导航の样式表如下---------------------- ------------
#menu ul {
margin: 0px;
パディング: 0px;
list-style-type: なし。
}
body {
font-family: "新宋体";
フォントサイズ: 12px;
行の高さ: 1.5;
}
#menu {
width: 100px;
境界線: 1px 実線 #FFFF66;
}
#menu ul li {
line-height: 26px;
背景色: #CCCCCC;
高さ: 26ピクセル;
境界線: 1px 実線 #FF9900;
位置: 相対的。
}
#menu ul li a {
color: #FF0000;
テキスト装飾: なし。
幅: 100ピクセル;
}
#menu ul li a:hover {
color: #00FF00;
幅: 100ピクセル;
背景色: #0000FF;
}

#menu ul li:hover {
background-color: #99FF66;
}
#menu ul li ul {
表示: なし;
境界線: 1px 実線 #FFFF99;
位置: 絶対的;
幅: 100ピクセル;
左: 100ピクセル;
上部: 0ピクセル;
}
#menu ul li:hover ul {
display: block;
}
a:hover {
背景色: #3300FF;
}
----------------------------------------------- ----------------
蠇红の地は隐藏を使用することができます、つまり说不过の话不示、那么これを理解できます
下面再見横向菜单的全部代--------------------------------------------------------
91659fcaa0a9594a6faa3c8d4f321cc4

36fc0da5a553527cb1d2a9551dbb853b
b2386ffb911b14667cb8f0f91ea547a7菜单演示6e916e0f7d1e588d4f442bf645aedb2f
080b747a20f9163200dd0a7d304ba388
8f237f55ea5362891f826e6f7bb54941
531ac245ce3e4fe3d50054a55f265927
9c3bca370b5104690d9ef395f2c5f8d1


9e490bea09a82f3ff6663081fb0e947b
25edfb22a4f469ecb59f1190150159c6ee7959cc8dd4be16ef633321c03dac32製品介绍5db79b134e9f6b82c0b36e0489ee08ed
ff6d136ddc5fdfeffaf53ff6ee95f185
25edfb22a4f469ecb59f1190150159c6ee7959cc8dd4be16ef633321c03dac32商品?5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6ee7959cc8dd4be16ef633321c03dac32商品?5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6ee7959cc8dd4be16ef633321c03dac32商品?5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6ee7959cc8dd4be16ef633321c03dac32商品?5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
bed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e
--------------------------------------------------水平メニュー スタイルが表示されます。ページを開いたときに 2 番目のメニューが非表示になっていますが、水平メニューでは がブロックとして定義されています。ブロックとして定義されている場合は非表示にする必要はないのでしょうか? また、水平メニューで第 2 レベルの ul を非表示に定義しようとしましたが、応答がありませんでした。マウスが第 1 レベルのメニュー上に移動したということは、第 2 レベルのメニューが完全に非表示になったことは、この非表示が継承されたことを意味します。関連する専門家に回答をお願いします、ありがとうございます


ディスカッション(解決策)への返信

確かに横向きでは隠れていませんが、見えません

#nav li ul {line-height:27px; list-style-type:none; text-align:left; left:-999em; width:180px; position:absolute;}

左を見ましたか:- 999em;、デフォルトの状況 以下はページ表示領域外です。
りー
マウスが通過すると左がデフォルトの位置に戻ったので表示されました。

もちろん、現在の状況では -999 は間違いなくページの外にあるため、非表示を使用することをお勧めしますが、UL 自体が左から 999 離れている場合、ページの左上隅に表示されます。

そうですね、ありがとう、それは本当に問題ではありません -999em が何を意味するか知っていますか?

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