


不怎么会css,在制作css纵向菜单时用到区块的隐藏,而在横向菜单中却没用到,很是纳闷,请高人解答_html/css_WEB-ITnose
先把纵向菜单的导航代码发出来
--------------------------------------------------------
nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
----------------------纵向菜单导航的样式表如下--------------------------------
#menu ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
body {
font-family: "新宋体";
font-size: 12px;
line-height: 1.5;
}
#menu {
width: 100px;
border: 1px solid #FFFF66;
}
#menu ul li {
line-height: 26px;
background-color: #CCCCCC;
height: 26px;
border: 1px solid #FF9900;
position: relative;
}
#menu ul li a {
color: #FF0000;
text-decoration: none;
width: 100px;
}
#menu ul li a:hover {
color: #00FF00;
width: 100px;
background-color: #0000FF;
}
#menu ul li:hover {
background-color: #99FF66;
}
#menu ul li ul {
display: none;
border: 1px solid #FFFF99;
position: absolute;
width: 100px;
left: 100px;
top: 0px;
}
#menu ul li:hover ul {
display: block;
}
a:hover {
background-color: #3300FF;
}
---------------------------------------------------------------
可以看到标红的地方用了隐藏,也就是说不划过的话就不显示,那么这个可以理解
下面再来看看横向菜单的全部代码-----------------------------------------
nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
--------------------------------------------可以看到横向菜单样式中并没有将任何部分隐藏,当在页面打开的时候二级菜单是隐藏的啊,很奇怪,纵向菜单是将ul定义成了块,而横向菜单是将a定义成了块,难道说将a定义为块就不用设置隐藏吗,而且我在横向菜单中试图将二级ul定义为隐藏的时候,当鼠标划过一级菜单的时候却没了反应,也就是说二级菜单彻底隐藏了,是不是说这个隐藏具有继承性呢。请相关的高手解答下哈,谢谢
回复讨论(解决方案)
横向时确实没有隐藏,只是你看不见而已
#nav li ul {line-height:27px; list-style-type:none; text-align:left; left:-999em; width:180px; position:absolute;}
看到left:-999em;了吗,默认情况下是在页面显示区域之外的。
#nav li:hover ul {left:auto;}
鼠标经过时把left恢复到了默认位置,所以就出现了。
当然还是建议你用隐藏,因为当前情况下-999肯定再页面外面,可要是你的ul本身就离左边999的话,就会出现在页面左上角了
嗯,谢谢了,还真不知道-999em是这个意思呢

Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

AI Hentai Generator
Menjana ai hentai secara percuma.

Artikel Panas

Alat panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas



Artikel ini membincangkan html & lt; kemajuan & gt; elemen, tujuan, gaya, dan perbezaan dari & lt; meter & gt; elemen. Tumpuan utama adalah menggunakan & lt; kemajuan & gt; untuk menyelesaikan tugas dan & lt; meter & gt; untuk stati

Artikel ini membincangkan html & lt; datalist & gt; elemen, yang meningkatkan bentuk dengan menyediakan cadangan autokomplete, meningkatkan pengalaman pengguna dan mengurangkan kesilapan. Kira -kira: 159

Artikel membincangkan amalan terbaik untuk memastikan keserasian silang pelayar HTML5, memberi tumpuan kepada pengesanan ciri, peningkatan progresif, dan kaedah ujian.

Artikel ini membincangkan html & lt; meter & gt; elemen, digunakan untuk memaparkan nilai skalar atau pecahan dalam julat, dan aplikasi umum dalam pembangunan web. Ia membezakan & lt; meter & gt; dari & lt; kemajuan & gt; dan Ex

Artikel ini membincangkan menggunakan atribut pengesahan bentuk HTML5 seperti had, corak, min, max, dan panjang untuk mengesahkan input pengguna secara langsung dalam penyemak imbas.

Artikel ini membincangkan tag Meta Viewport, penting untuk reka bentuk web responsif pada peranti mudah alih. Ia menerangkan bagaimana penggunaan yang betul memastikan skala kandungan yang optimum dan interaksi pengguna, sementara penyalahgunaan boleh membawa kepada isu reka bentuk dan kebolehaksesan.

Artikel ini membincangkan & lt; iframe & gt; Tujuan TAG dalam membenamkan kandungan luaran ke dalam halaman web, kegunaan umum, risiko keselamatan, dan alternatif seperti tag objek dan API.

Giteepages Statik Laman Web Penggunaan Gagal: 404 Penyelesaian Masalah dan Resolusi Ralat Semasa Menggunakan Gitee ...
