导航栏源代码
⑴ 网站导航栏源代码文件
一般都是dada,只是看你自己后面有没有改文件夹
⑵ 淘宝店铺导航条怎么做,源代码怎么找到哪里有具体如何做
自已也可以弄,但是不懂的话比较麻烦!/* 淘宝店铺导航栏CSS代码之分步详解第一部分、静态背景颜色 */ /* 1、首页/店铺动态/其它导航类目的背景色,这里设为红色 */ .skin-box-bd .menu-list .link{background:red;} /* 2、所有分类的背景色(最左边的),一样设为红色 */ .all-cats .link{background:red;} /* 到这里,发觉右边的颜色还没有变呢,好的,接着下一步 */ /* 3、导航条整个分类段背景色,还是要设为红色,整体布局好看些 */ .skin-box-bd .menu-list{background:red;} /* 注意观察,最右边还有一丝地方没有变 */ /* 4、导航条背景色(是最底层了吧),修补导航右侧缺口,再设为红色 */ .skin-box-bd{background:red;} /* 小结:有点成功感了!换换其它颜色试试看吧 */ /* 背景色最好搭配页头背景图,才能整体大气美观 */ /* 第二部分、分隔线、静态文字的颜色 */ /* 5、首页等分类的右边的分隔线颜色,设为白色 */ .menu-list .menu{border-color:white;} /* 6、所有分类的右边的分隔线颜色,设为白色 */ .all-cats .link{border-color:white;} /* 7、首页/店铺动态/其它导航类目的文字颜色 */ .menu-list .menu .title{color:yellow;} /* 8、所有分类的文字颜色(最左边那个),*/ .all-cats .link .title{color:yellow;} /* 小结:其实原来默认文字的颜色也挺好的 */ /* 第三部分、分类下的颜色 */
⑶ 求一个html+css的多级导航的最简洁的源代码,样式随便,希望不是百度复制来的,想用于学习。
<!---
其实设计思路很简单,就是子栏目的CSS默认的display为none,不显示,鼠标经过父栏目的时候将子栏目的display设为block,鼠标经过事件的CSS伪类是:hover,例如:a:hover表示鼠标经过链接时,注意中间的冒号用英文。有问题可直接hi我。
->
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>二级菜单</title>
<styletype="text/css">/*整体设置*/
#menu{
margin:0;
padding:0;
width:610px;
list-style-type:none;
font:14pxArial;
}
#menuli{
float:left;
padding:0;
margin:01px00;
width:150px;
}
/*设置菜单项*/
#menulidl{
width:150px;/*ie6*/
margin:0;
padding:0010px0;
background:#cb6url(images/bottom.gif)no-repeatbottomleft;
}
#menulidta,#menulidda{display:block;}
/*设置菜单项的dt*/
/*设置菜单项的dt*/
#menulidt{
margin:0;
padding:5px;
text-align:center;
border-bottom:1pxsolid#b00;
background:
}
#menulidt.orange{background:#fa5url(images/top.gif)no-repeattopleft;}
#menulidt.yellow{background:#ee5url(images/top.gif)no-repeattopleft;}
#menulidt.green{background:#5e5url(images/top.gif)no-repeattopleft;}
#menulidt.blue{background:#5cfurl(images/top.gif)no-repeattopleft;}
#menulidta,#menulidta:visited{
display:block;
color:#333;
text-decoration:none;
}
/*设置菜单项的dd*/
#menulidd{
margin:0;
padding:0;
color:#fff;
background:#47a;
}
#menulidd.last{
border-bottom:1pxsolid#b00;
}
#menulidda,#menulidda:visited{
height:1em;
display:block;
color:#fff;
text-decoration:none;
padding:4px5px4px20px;
background:#47aurl(images/arrow.gif)no-repeat10px10px;
}
/*关闭子菜单*/
#menulidd{display:none;}
/*设置鼠标响应*/#menuli:hoverdd{display:block;}
#menulidda:hover{
background:#147;
color:#9cf;
}
</style>
</head>
<body>
<ulid="menu">
<li>
<dl>
<dtclass="orange"><ahref="#">ArtechStudio</a></dt>
<dd><ahref="#">WebDev</a></dd>
<dd><ahref="#">WebDesign</a></dd>
<dd><ahref="#">Books</a></dd>
<ddclass="last"><ahref="#">ContactUs</a></dd>
</dl>
</li>
<li>
<dl>
<dtclass="yellow"><ahref="#">ArtechStore</a></dt>
<dd><ahref="#">Books</a></dd>
<dd><ahref="#">DVDs</a></dd>
<dd><ahref="#">Movies</a></dd>
<ddclass="last"><ahref="#">Service</a></dd>
</dl>
</li>
<li>
<dl>
<dtclass="green"><ahref="#">ArtechAchi</a></dt>
<dd><ahref="#">Landscape</a></dd>
<dd><ahref="#">Plan</a></dd>
<dd><ahref="#">Design</a></dd>
<ddclass="last"><ahref="#">Maps</a></dd>
</dl>
</li>
<li>
<dl>
<dtclass="blue"><ahref="#">ArtechScience</a></dt>
<dd><ahref="#">Physics</a></dd>
<dd><ahref="#">Maths</a></dd>
<dd><ahref="#">Chemistry</a></dd>
<ddclass="last"><ahref="#">Courses</a></dd>
</dl>
</li>
</ul>
</body>
</html>
⑷ 淘宝店铺导航条源代码怎么找到
导航条的代码
你是直接写就行了!!或者是切片也行!!如果你想做成一般网页上的那专种导航
除了买模板意属外没有其他的办法了!!因为淘宝为了网店的稳定行
已经屏蔽了DIV+CSS的功能!!DIv+css只有对淘宝设计师开放!!
⑸ HTML 制作左侧导航栏 源代码 要求如下图
你直接运行就可以了:版权: function setTab(m,n){ var tli=document.getElementById("leftmenu"+m).getElementsByTagName("li"); var mli=document.getElementById("mcont"+m).getElementsByTagName("ul"); for(i=0;i
⑹ 网站导航栏源码 哪里有呀我要准确的
自己做不就好了吗。不难
⑺ html下拉导航栏代码
这个是用JS实现的。你网络一下,JS实现二级导航源码就有了。
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>简洁的纯下拉菜单代码</title>
<style>
#sddm
{ margin:0auto;
padding:0;
z-index:30;
background-color:#F4F4F4;
width:480px;
height:23px;}
#sddmli
{ margin:0;
padding:0;
list-style:none;
float:left;
font:bold12pxarial}
#sddmlia
{ display:block;
margin:01px00;
padding:4px10px;
width:60px;
background:#5970B2;
color:#FFF;
text-align:center;
text-decoration:none}
#sddmlia:hover
{ background:#49A3FF}
#sddmdiv
{ position:absolute;
visibility:hidden;
margin:0;
padding:0;
background:#EAEBD8;
border:1pxsolid#5970B2}
#sddmdiva
{ position:relative;
display:block;
margin:0;
padding:5px10px;
width:auto;
white-space:nowrap;
text-align:left;
text-decoration:none;
background:#EAEBD8;
color:#2875DE;
font:12pxarial}
#sddmdiva:hover
{ background:#49A3FF;
color:#FFF}
</style>
<!--ddmenu-->
<scripttype="text/javascript">
<!--
vartimeout=100;
varclosetimer=10;
varddmenuitem=0;
//openhiddenlayer
functionmopen(id)
{
//cancelclosetimer
mcancelclosetime();
//closeoldlayer
if(ddmenuitem)ddmenuitem.style.visibility='hidden';
//getnewlayerandshowit
ddmenuitem=document.getElementById(id);
ddmenuitem.style.visibility='visible';
}
//closeshowedlayer
functionmclose()
{
if(ddmenuitem)ddmenuitem.style.visibility='hidden';
}
//goclosetimer
functionmclosetime()
{
closetimer=window.setTimeout(mclose,timeout);
}
//cancelclosetimer
functionmcancelclosetime()
{
if(closetimer)
{
window.clearTimeout(closetimer);
closetimer=null;
}
}
//closelayerwhenclick-out
document.onclick=mclose;
//-->
</script>
</head>
<bodystyle="text-align:center">
<ulid="sddm">
<li><ahref="#"onmouseover="mopen('m1')"onmouseout="mclosetime()">Home</a>
<divid="m1"onmouseover="mcancelclosetime()"onmouseout="mclosetime()">
<ahref="#">HTMLDropDown</a>
<ahref="#">DHTMLDropDownmenu</a>
<ahref="#">JavaScriptDropDown</a>
<ahref="#">DropDownMenu</a>
<ahref="#">CSSDropDown</a>
</div>
</li>
<li><ahref="#"onmouseover="mopen('m2')"onmouseout="mclosetime()">Download</a>
<divid="m2"onmouseover="mcancelclosetime()"onmouseout="mclosetime()">
<ahref="#">ASPDropdown</a>
<ahref="#">Pulldownmenu</a>
<ahref="#">AJAXdropdown</a>
<ahref="#">DIVdropdown</a>
</div>
</li>
<li><ahref="#"onmouseover="mopen('m3')"onmouseout="mclosetime()">Order</a>
<divid="m3"onmouseover="mcancelclosetime()"onmouseout="mclosetime()">
<ahref="#">VisaCreditCard</a>
<ahref="#">Paypal</a>
</div>
</li>
<li><ahref="#"onmouseover="mopen('m4')"onmouseout="mclosetime()">Help</a>
<divid="m4"onmouseover="mcancelclosetime()"onmouseout="mclosetime()">
<ahref="#">DownloadHelpFile</a>
<ahref="#">Readonline</a>
</div>
</li>
<li><ahref="#"onmouseover="mopen('m5')"onmouseout="mclosetime()">Contact</a>
<divid="m5"onmouseover="mcancelclosetime()"onmouseout="mclosetime()">
<ahref="#">E-mail</a>
<ahref="#">SubmitRequestForm</a>
<ahref="http://www.codefans.net/"target="_blank">codefans.net</a>
</div>
</li>
</ul>
</body>
</html>
⑻ 求大神用HTML5和CSS做出这个导航条,求源代码,急求大神帮忙
你可以保存这个,然后修改就可以了,审查元素
⑼ 导航下拉菜单栏的源码 麻烦那位高手给我一个
<%@ page language="java" import="java.util.*" pageEncoding="GB2312"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>测试</title>
<style type="text/css">
*{
margin:0; padding:0;
}/*所有对象外边距和内边距设置为零*/
body{
font-family: arial, 宋体, serif;
font-size:12px;
padding:50px;
}/*设置页面字体为“宋体”,大小为“norma”,内边距
为"padding"l*/
span{
font-family: arial, 宋体, serif;
font-size:18px;
padding:16px;
}
#item{
line-height: 24px;
list-style-type: none;
background:#666;
}
#item a{
display: block;
width: 80px;
text-align:center;
text-decoration:none; /*除去下划线*/
}
#item a:link { /*访问之前的样式*/
color:#666;
text-decoration:none;
}
#item a:visited { /*访问之后的样式*/
color:#666;
text-decoration:none;
}
#item a:hover { /*鼠标滑过*/
color:#FFF;
text-decoration:none;
font-weight:bold; /*设置字体的粗细*/
background:#999;
}
#item li {
float: left; /*让LI标签浮动到左边,一级菜单并排*/
width: 80px;
background:#CCC;
}
#item li ul {
line-height: 27px; /*行高*/
list-style-type: none; /*去除UL前面的点*/
text-align:left;
left: -999em;
width: 180px;
position: absolute;
}
#item li ul li{
float: left;
width: 180px;
background: #F6F6F6;
}
#item li ul a{
wedisplay: block;
width: 180px;
text-align:left;
padding-left:24px;
}
#item li ul a:link {
color:#666;
text-decoration:none;
}
#item li ul a:hover {
color:#F3F3F3;
text-decoration:none;
font-weight:normal; /*字体的粗细*/
background:#C00;
}
#item li:hover ul {
left: auto;
}
#item li.iehover ul {
left: auto;
}
#content {
clear: left;
}
</style>
<script type="text/JavaScript">
navHover = function() {
var lis = document.getElementById("item").getElementsByTagName("LI");
for (var i=0; i<lis.length; i++) {
lis[i].onmouseover=function() {
this.className+=" iehover";
}
lis[i].onmouseout=function(){
this.className=this.className.replace(new RegExp(" iehover\\b"), "");//这句是把类名是iehover的变为空
}
}
}
if (window.attachEvent) window.attachEvent("onload", navHover);
</script>
</head>
<body>
<div>
<span>下拉菜单的demo</span>
<ul id=item>
<li class=menu><a href=#>菜单一</a>
<ul class=menu1>
<li><a href=#>选项一</a></li>
<li><a href=#>选项二</a></li>
<li><a href=#>选项三</a></li>
</ul>
</li>
<li class=menu><a href=#>菜单二</a>
<ul class=menu1>
<li><a href=#>选项一</a></li>
<li><a href=#>选项二</a></li>
<li><a href=#>选项三</a></li>
</ul>
</li>
</ul>
</div>
</body>
</html>