大橙子网站建设,新征程启航

为企业提供网站建设、域名注册、服务器等服务

css中如何使用ulli实现四层级联菜单

这篇文章主要为大家展示了“css中如何使用ul li实现四层级联菜单”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“css中如何使用ul li实现四层级联菜单”这篇文章吧。

成都创新互联是一家专注于做网站、网站设计与策划设计,新和网站建设哪家好?成都创新互联做网站,专注于网站建设10余年,网设计领域的专业建站公司;建站业务涵盖:新和等地区。新和做网站价格咨询:18982081108

代码如下:

 
 
 
 
 
a 
{ 
color:Black; /*--a标签的默认颜色为黑色--*/ 
text-decoration:none; /*--隐藏超链接的下划线--*/ 
} 
a:hover 
{ 
/**--当鼠标聚焦到a标签的时候文字显示为红色--*/ 
color:Red; 
} 
#div1 ul 
{ 
/*--去掉文字前面的小圆点--*/ 
list-style-type:none; 
} 
#div1 ul li 
{ 
border-style:solid; 
border-width:1px; 
padding:6px; 
width:2.2cm; 
text-align:center; 
background-color:#eeeeee; 
} 
#div1 ul li ul 
{ 
display:none; /*--默认隐藏一级菜单外的其他菜单--*/ 
} 
#div1 ul li:hover ul 
{ 
display:block; 
position:relative; 
left:50px; 
height:0px; 
top:-25px; 
} 
#div1 ul li:hover ul li ul /*--当鼠标聚焦到一级菜单下的li的时候,隐藏三级菜单--*/ 
{ 
display:none; 
} 
#div1 ul li ul li:hover ul /*--当鼠标聚焦到二级菜单下的li的时候,显示三级菜单,并设置菜单显示为block样式--*/ 
{ 
display:block; 
} 
#div1 ul li ul li:hover ul li ul /*--当鼠标聚焦到二级菜单下的li的时候,隐藏四级菜单--*/ 
{ 
display:none; 
} 
#div1 ul li ul li ul li:hover ul /*--当鼠标聚焦到三级菜单下的li的时候,显示四级菜单,并设置菜单显示为block样式--*/ 
{ 
display:block; 
} 
 
 
 
function config() { 
if (confirm("你确定要联系我们吗?")) { 
//window.location.href = 'http://www.baidu.com'; 
//location.href = "http://www.baidu.com"; 
//window.open('http://www.baidu.com'); 
if (confirm("能不能不要联系我们啊?") == true) { 
return; 
} 
else { 
window.open("http://www.baidu.com"); 
} 
} 
else { 
return; 
} 
} 
 
 
 
 
     
  • 中国 
       
    • 湖南 
         
      • 长沙 
           
        • 芙蓉区
        •  
        • 天心区
        •  
        • 雨花县
        •  
        • 望城区
        •  
        • 开福区
        •  
         
      •  
      • 衡阳 
           
        • 雁峰区
        •  
        • 朱辉区
        •  
        • 石鼓县
        •  
        • 祁东县
        •  
        • 南岳区
        •  
         
      •  
      • 永州 
           
        • 零陵区
        •  
        • 冷水滩区
        •  
        • 东安县
        •  
        • 潇湘区
        •  
         
      •  
       
    •  
    • 北京 
         
      • 朝阳区
      •  
       
    •  
    • 广东 
         
      • 广州 
           
        • 天河区
        •  
        • 越秀区
        •  
        • 海珠区
        •  
         
      •  
      • 深圳 
           
        • 罗湖区
        •  
        • 福田区
        •  
        • 南山区
        •  
        • 盐田区
        •  
        • 宝安区
        •  
        • 龙岗区
        •  
         
      •  
      • 东莞
      •  
      • 佛山
      •  
       
    •  
     
  •  
  • 美国 
       
    • 纽约 
         
      • 曼哈顿区
      •  
      • 皇后区
      •  
       
    •  
    • 华盛顿
    •  
    • 芝加哥
    •  
     
  •  
  • 俄罗斯 
       
    • 莫斯科
    •  
    • 圣彼得堡
    •  
     
  •  
  • 请联系我们
  •  
 
   

以上是“css中如何使用ul li实现四层级联菜单”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联行业资讯频道!


网页名称:css中如何使用ulli实现四层级联菜单
文章网址:http://dzwzjz.com/article/ihosds.html

其他资讯

在线咨询
服务热线
服务热线:028-86922220
TOP