快消品货源批发市场
快消品货源分销平台
 
 
当前位置: 货源批发网 » 网商学院 » 网店装修 » 淘宝店铺装修 » 淘宝店铺装修中修改导航条颜色方法图文教程

淘宝店铺装修中修改导航条颜色方法图文教程

放大字体  缩小字体 发布日期:2024-06-02 10:01:52  来源:电商联盟  作者:乐发网  浏览次数:31

这篇文章主要介绍了淘宝店铺装修中修改导航条颜色方法图文教程,本文用一个实际案例讲解了一个彩色导航条的制作过程,需要的朋友可以参考下

很多淘宝卖家们在下载了淘宝专业版模板之后,往往不满足于模板的色彩搭配,尤其是导航条的色彩,于是想修改导航条的颜色,那么如何修改呢,这里要用到一些代码。

今天我们给大家提供一款导航条色彩css,操作方法呢也很简单。大家只要对其中的#之后的颜色或者background后面的背景图片进行改变就行了。

导航条色彩css代码(复制下面代码即可):


nclick="copycode(getid('phpcode1'));">复制代码
代码如下:

.skin-box-bd .menu-list{background: none repeat scroll 0 0 #f86c4c}

.skin-box-bd .menu-list .link{background: none repeat scroll 0 0 #f86c4c}

.skin-box-bd .menu-list .menu{border-right:1px #f86c4c solid;}

.skin-box-bd .menu-list .menu .title{color:#000000}

.all-cats .link{background: none repeat scroll 0 0 #f86c4c;}

.all-cats .link{border-right:1px #f86c4c solid;}

.skin-box-bd .all-cats .title{color:#000000}
.skin-box-bd{height:35px;background:url(http://www.jb51.net/shangchuan/20131016111822.jpg) no-repeat 0 0;}
.skin-box-bd a{color:#FFFFFF;font-family:微软雅黑;font-size:14px;font-weight:normal;}
.skin-box-bd .menu{background:none;line-height:35px;}.skin-box-bd .menu-list{height:35px;}
.skin-box-bd .menu-list .link .title{margin:0px;}
.skin-box-bd .menu-list .link{background:none;height:35px;line-height:35px;padding:0 20px;}
.skin-box-bd .menu-list .menu{padding-right:0px;}
.skin-box-bd.menu-list .menu a{background:url(http://img.taobao.com/L1/142/404327582/assets/images/head/nav_li_bg.jpg) no-repeat right center;font-family:微软雅黑;font-weight:normal;}
.skin-box-bd .menu-list .menu a:hover{background:url(http://www.jb51.net/shangchuan/20131016111827.png) no-repeat 0 center;cursor:pointer;}
.skin-box-bd .menu-list .menu a span{font-size:15px;color:#000;}
.skin-box-bd .all-cats .link{background:none;line-height:35px;padding:0 10px;width:168px;}
.skin-box-bd .all-cats .link{background:url(http://www.jb51.net/shangchuan/20131016111827.png) no-repeat 0 center;border:none;color:#FFF;font-family:微软雅黑;font-size:15px;font-weight:normal;height:35px;line-height:35px;}
.skin-box-bd .all-cats .link .title{font-size:15px;margin-left:10px;}
.skin-box-bd .all-cats .link .popup-icon{display:none;}
.skin-box-bd .popup-content{background:#F68B8B;border:none;}
.skin-box-bd .popup-content .cats-tree .snd-pop-inner{background:#65B6A4;}
.skin-box-bd .popup-content.cats-tree .cat-hd:hover,.skin-box-bd .popup-content .cats-tree.cat-hd-hover{background:#86CABB;}
.skin-box-bd .popup-content .cats-tree .snd-cat-hd:hover,.skin-box-bd .popup-content .cats-tree .snd-cat-hd-hover{background:#D90724;}
.skin-box-bd .popup-content .cats-tree .has-children{background:none;}
.skin-box-bd .popup-content .cats-tree .fst-cat-icon{background:none;}
.skin-box-bd .popup-content .cats-tree .snd-cat-icon{background:none;}
.skin-box-bd .menu-list .link .popup-icon{display:none;}
.skin-box-bd .menu-popup-cats .sub-cat-hover{background:#86CABB;}

将上面的代码全选后,复制,然后打开店铺装修,点击到导航条,选择编辑。

在出现的导航代码编辑框中,选择“显示设置”,如图所示:

如何更改导航条颜色

将代码黏贴到编辑框中,选择确定。

然后保存就可以看到效果了。

2

如果你对这个色彩不满意,可以对代码中的background及其#后面的颜色进行修改。

乐发网超市批发网提供超市货源信息,超市采购进货渠道。超市进货网提供成都食品批发,日用百货批发信息、微信淘宝网店超市采购信息和超市加盟信息.打造国内超市采购商与批发市场供应厂商搭建网上批发市场平台,是全国批发市场行业中电子商务权威性网站。

本文内容整合网站:百度百科知乎淘宝平台规则

本文来源: 淘宝店铺装修中修改导航条颜色方法图文教程

分享与收藏:  网商学院搜索  告诉好友  关闭窗口  打印本文 本文关键字:
 
更多..资源下载
淘宝店铺装修图文
【官方】旺铺新功能多端同步页使用教程 淘宝装修子账号设置流程
淘宝店铺装修如何实现全屏轮播 淘宝店铺,天猫店铺背景固定的方法。
淘宝店铺装修网商学院推荐
淘宝店铺装修点击排行
 
手机版 手机扫描访问