DIV+CSS做的透明菜单兼容IE、FF等 -- [DIV+CSS]─ 深山工作室提供网络投票系统|微信公众号投票|微信公众号小程序|抖音小程序|百度小程序|微信公众号开发|企业网站建设

DIV+CSS做的透明菜单兼容IE、FF等

深山行者个人网站 2009/9/18 17:13:53 深山行者字体:大中小浏览 19581

.menuc li {display:block;line-height:32px;position:relative;float:left;}/*关键部分*/

以下为详细代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>DIV+CSS做的透明菜单兼容IE、FF等</title>
<style>
html,body,div,span,object,h1,h2,h3,h4,h5,h6,table,tr,td,p,img,ul,li,dl,dt,dd {margin:0;padding:0;border:0;}
html,body {outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;}
html {background:#fff;}
body {margin:0 auto;text-align:center;font:normal 12px/160% Tahoma,Arial,宋体,sans-serif;color:#737171;}
ul {list-style-type:none;}

form,input,select {margin:0;padding:0;font-family:Tahoma,Arial,宋体,sans-serif;font-size:12px;}
a:link,a:visited {color:#7E7E7E;text-decoration:none;}
a:hover {color:#f00;text-decoration:underline;}

/*publict start*/
.clear1 {clear:both;height:0;line-height:0;font-size:0;}

#menu {clear:both;height:31px;background:#3f5058 url(./images/menucbg.gif) repeat-x;overflow:hidden;}
 #menu .tl,#menu .tr,#menu .bl,#menu .br {display:none;}
 #menu .dy {display:none;}
 #menu .tc {background:url(./images/menubg.gif) no-repeat left top;width:4px;height:31px;float:left;}
 #menu .bc {background:url(./images/menubg.gif) no-repeat right top;width:4px;height:31px;float:right;}
 .menuc {float:left;display:inline;margin:0 0 0 20px;font-weight:bold;position:relative;}
 .menuc li {display:block;line-height:32px;position:relative;float:left;}
 
 .menuc li a {float:left;margin:0 8px;font-size:12px;}
 .menuc li a span {float:left;color:#fff;padding:0 15px;}
 .menuc li a:link,.menuc li a:visited {}
 .menuc li a:hover {}
 .menuc li a:hover span {color:#fffc00;text-decoration:none;text-decoration:underline;}
 .menuc .line {float:left;margin-top:2px;width:1px;height:27px;background:#586261 url(./images/menucline.gif) no-repeat;} 
 .menuc .on {}
 .menuc .on a:link,.menuc .on a:visited {}
 .menuc .on a:link span,.menuc .on a:visited span {color:#fffc00;font-weight:bold;text-decoration:underline;}
 .menuc .on a:hover {text-decoration:none;}
 .menuc a:hover {text-decoration:none;cursor:pointer;}

.menuc .menulist {position:absolute;z-index:1000;top:0px;left:0px;margin-top:31px;background:#ebf0f4;line-height:24px;display:none;padding:6px;filter: Alpha(opacity=80);moz-opacity: 0.8;}
.menuc .menulist a {display:block;}
.menuc .menulist a:link,.menuc .menulist a:visited {white-space:nowrap;color:#000;}
.menuc .menulist a:hover {color:#f00;text-decoration:underline;}

</style>
</head>
<body>

<div id="container">

</div>

</div>

</body>
</html>

前一页:CSS+ul 实现的柱状图

后一页:超强的中间自适应,左右固定,有许多值得学习的地方

相关阅读: 利用CSS的position定位属性定义一个顶部飘动的柳叶效果非常酷; 微信小程序直播组件live-player-plugin（wx2b03c6e691cd7370）; ASP汉字转拼音，支持自定义特殊词语; 深山工作室; 一个利用纯java做的非常漂亮的页面背景花瓣效果; 微信公众号回复图片消息或用客服接口推送图片消息; 判断用户注册密码强度的JS代码; ul,li设置新闻列表,超出范围对象,自动隐藏

更多信息>>栏目类别选择: 百度小程序开发; 微信小程序开发; 微信公众号开发; uni-app; asp函数库; ASP; DIV+CSS; HTML; python

更多>>同类信息: jquery设置或获取修改classname; 利用css3.0写出一个音乐播放的唱片碟盘的效果; 利用css中的scale()实现放大缩小效果; 利用background-color:#000000a8在背景颜色16进制代码之后加字母加上数字让背景色透明; css背景使用base64编码或者将base64编码放在img图片标签中; 利用css3中的-webkit-font-smoothing把网页文字的毛边去掉

更多>>最新添加文章: 2026 aliyun阿里域名云注册续费优惠口令; dw里面查找替换使用正则删除sqlserver里面的CONSTRAINT; Android移动端自动化测试：使用UIAutomatorViewer与Selenium定位元素; 抖音直播音挂载小雪花懂车帝小程序; javascript获取浏览器指纹可以用来做投票; 火狐Mozilla Firefox出现：无法载入您的Firefox配置文件它可能已经丢失或是无法访问问题解决集合处理办法; 在Android、iOS、Windows、MacOS中微信小程序的文件存放路径; python通过代码修改pip下载源让下载库飞起

更多>>随机抽取信息: 一些在工作中收集的企业文化标语; 深山工作室; web2.0中流行的设计元素：颜色; 使用uni-app开始小程序使用腾讯视频插件vid播放视频; 超级实用且不花哨的js代码大全( 6 ); 青岛联合假日旅行社

更多标签热门标签

计划查询 input DropShadow 图片彩色 asp 读取模式防止上下左右 ie5.5 旅行社 lightbox 忧化项目断线 pt 案例文件夹 VBScript 文化营销轮流显示背景色阴影效果 Application 渐变 rss 汉字 clear 比例 163 边界重叠蜘蛛设计调用 dreawmeaver 墙导出关键词幻灯 png 过期缓存 web 2.0 素材版权点击