为什么html中li浮动,相对定位下的绝对定位下的li为什么不能浮动??

这篇博客探讨了网页菜单的设计,包括背景图片、菜单项排列、颜色搭配以及悬停效果。详细阐述了如何通过CSS实现菜单的动态效果,如导航条的下拉菜单和鼠标悬停时的颜色变化。此外,还讨论了菜单在用户体验中的重要性,以及如何优化菜单以提高网站的可用性。
摘要由CSDN通过智能技术生成

该楼层疑似违规已被系统折叠 隐藏此楼查看此楼

.menu{background:url("../images/menu.gif") no-repeat ; width:992px;margin:0 auto;}

.menu ul{padding-left:10px;}

.menu li{float:left; text-align:center; color:#fff; height:62px; display:inline; position:relative; display:block; font-weight:700;line-height:35px; width:78px;} .menu a{ color:#fff; text-decoration:none; padding-left:5px; }

.menu li a:hover{color:#000;line-height:35px;display:block;width:78px;height:35px;background:#637a88;text-decoration:none;padding-left:5px;}

#nav{ color:#000;display:block;line-height:35px;width:78px;height:35px;background:none;padding-right:5px;background: url(../images/nav.gif) no-repeat left bottom;} .menu ul li ul { width:140px; position:absolute; color:#000; z-index:99; left:0px; top:35px; display:block; background:url(../images/menu_1.gif) no-repeat; height:27px; margin-left:5px;}

.menu ul li ul li{

float:left;

color:#000;

width:140px;

display:block;

line-height:27px;

white-space:normal;

word-spacing:normal;

padding-left:5px;

padding-right:5px;

}

.menu ul li ul li span{width:20px; float:left; background:url(../images/menu_1.gif) no-repeat right 0; height:27px;}

.menu ul li ul li a{color:#999; text-decoration:none}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值