仓酷云

标题: 来一发DIV+CSS组成树型菜单 [打印本页]

作者: 冷月葬花魂    时间: 2015-1-16 00:13
标题: 来一发DIV+CSS组成树型菜单
不管你用什么工具软件制作网页,都有在有意无意地使用CSS。用好CSS能使你的网页更加简炼,同样内容的网页,有的人做出来有几十KB,而高手做出来只有十几KB。
这是用DIV+CSS+JS组成的树型菜单,接纳列表,切合WEB尺度,在年夜多半WIN扫瞄器下,兼容性不错,
xhtml奏效果页,我如今做的是二个菜单,假如必要增加,可把<ulclass="collapsed"id="submenuid2">......</ul>之间的内容加上往,"submenuid"加1,检察效果。
CSS代码
body{margin:0px;padding:0;font:12px"LucidaGrande",Verdana,Arial,Helvetica,sans-serif;background:#FFFFFF;text-align:center;}ul{margin:0;padding:0;list-style:none;}#treenav{margin:10px;text-align:left;}#treenavulli{margin:1px0;padding:0;font-size:11px;}#treenavul.expanded{display:block;}#treenavul.expanded,#treenavul.collapsed{margin:5px10px;}#treenavul.collapsed{display:none;}.expandedli,.collapsedli{border-bottom:1pxdashed#CCCCCC;width:100px;}.listhead{font-weight:bold;display:block;font-size:12px;color:#333333;background:#F1F1F1;padding:3px;width:120px;margin:1px0;}#treenava{text-decoration:none;color:#666666;}#treenava:hover{color:#990000;}JS代码
functiontoggleMenu(id){
element=document.getElementById(id);
element.className=(element.className.toLowerCase()==expanded?collapsed:expanded);
}
onload=function(){
toggleMenu(submenuid);
}
</p>
所有的设计第一步就是构思,构思好了。
作者: 灵魂腐蚀    时间: 2015-1-18 05:35
Dreamweaver在所见即所得添加链接时,可以在选中文字后在属性栏中的链接栏中直接输入文件的地址即可。
作者: 第二个灵魂    时间: 2015-1-26 16:36
使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。
作者: 小女巫    时间: 2015-2-4 20:54
运动)时间轴面板--拖动关键帧--单击整条--将鼠标移至中间一点--右击选择增加关键帧--移动中间关键帧的图层--勾选自动播放,循环
作者: 柔情似水    时间: 2015-2-10 10:27
dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS,三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。
作者: 愤怒的大鸟    时间: 2015-3-1 12:16
技术的学习如同长跑。只要越过极限,就会越跑越轻松。技术的学习其实并不像想象中那么可怕,任何技术都并不高深莫测。
作者: 透明    时间: 2015-3-10 17:53
帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。
作者: 因胸联盟    时间: 2015-3-17 09:47
技术的学习如同长跑。只要越过极限,就会越跑越轻松。技术的学习其实并不像想象中那么可怕,任何技术都并不高深莫测。
作者: 再现理想    时间: 2015-3-24 06:46
时间轴)窗口--时间轴--选中图层并拖图层到时间轴,将其放在指定帧上




欢迎光临 仓酷云 (http://www.ckuyun.com/) Powered by Discuz! X3.2