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

所属分类: 电子商务 / 淘宝/天猫 阅读数: 1928
收藏 0 赞 0 分享

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

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

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


复制代码
代码如下:

/* 导航条背景色*/ .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(https://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(https://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(https://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及其#后面的颜色进行修改。

更多精彩内容其他人还在看

2015天猫双十一11.11购物券使用门槛 附双11购物券领取攻略

2015年的天猫双十一和往年不同的是,今年天猫将为消费者提供“11.11购物券”,购物券在消费者端以购物券的形式显示,但实际代表的是一种消费者可于购物时直接抵减一定面额现金的消费权益,下面就一起来看看2015天猫双十一11.11购物券使用门槛
收藏 0 赞 0 分享

天猫超市双11新专场活动入口曝光 满188减100元再送100

天猫超市双十一又上线新活动啦,从11月1日开始到11月10日,全国的消费者在天猫超市购买日用百货商品可享满188元立减100,同时还能获得100元现金券,超值哦,内附连接,感兴趣的朋友可以进来看看
收藏 0 赞 0 分享

2015年双十一抢红包活动都有有哪些?2015双11抢红包活动地址介绍

2015双十一购物节就要到了,各大店家们纷纷使出自家的“杀手锏”。那么2015年双十一抢红包活动都有有哪些?下面小编就为大家介绍2015双11抢红包活动地址,一起来看看吧
收藏 0 赞 0 分享

2015天猫淘宝双11怎么拆未拆开的红包?双十一喊人来拆红包使用方法

2015双十一即将来临,目前处于抢红包状态,这个红包必须让好友给自己拆,有可能有现金有可能是优惠券有可能什么都没有,那么若获得了“未拆开红包”该怎么拆开呢?下面就详情来看看了解一下
收藏 0 赞 0 分享

2015双11红包在哪里领?天猫双11红包入口通道介绍

临近双11,天猫推出了双11抢红包活动,很多用户们都不知道2015双11红包在哪里领,以及天猫双11红包入口在哪里?针对出问题,本文就为大家进行解答
收藏 0 赞 0 分享

天猫2015双11红包雨什么时候开抢 天猫双十一红包雨活动攻略介绍

2015天猫双十一活动这几天已经陆续开始了,今年天猫双11还有一个最大的活动据说就是红包雨了,要不怎么敢号称雨,那么天猫2015双11红包雨什么时候开抢
收藏 0 赞 0 分享

天猫双十一密令红包密令文字是什么 天猫2015双11密令红包开枪攻略

快到双十一了,天猫推出了一系列红包,天猫、天猫商家和明星等都可以创建密令,为消费者发出密令红包,不过密令红包是需要密令文字
收藏 0 赞 0 分享

天猫网厅双11红包几点开抢 天猫网厅双11活动时间及活动奖品详情

双11即将到来,近日,天猫网厅提前开启双11预热活动,每天不同时段天猫网厅都将送出话费流量红包哦!那么,天猫网厅双11红包几点开抢?以及有哪些奖励呢?针对此问题,本文就为大家进行解答
收藏 0 赞 0 分享

2015天猫双十一晚会一元购攻略 11月10日天猫双11晚会摇一摇抽奖活动

今年11月10日20点30分开始,2015天猫双十一晚会将在“水立方”举行并向全球消费者同步直播,届时用户可以通过摇一摇的方法获得1元购商品,下面小编就给大家带来详细的介绍及天猫双十一晚会一元购攻略
收藏 0 赞 0 分享

2015天猫双11密令红包怎么抢?11月5日、6日、7日密令公布名单汇总

11月5 -10日,开启天猫密令红包时间到啦!今天11月5日早上10点开抢,密令将在各个微博大号中陆续发布,打开淘宝或天猫搜索相应的密令就有机会抢到红包,下面就详情来看看了解一下
收藏 0 赞 0 分享
查看更多