如何设置店铺导航条颜色【通用十篇】

现在有很多人注册成为了淘宝网的店家，然而装修的问题让这些新手店主十分头疼。在装修过程中该如何设置店铺的导航条颜色呢。下面让大家好好学习一下设置的方法。

附：颜色代码

1 白颜色FFFFFF2 红颜色FF00003 绿颜色 #00FF00

4 蓝颜色0000FF5 牡丹红FF00FF6 青颜色 #00FFFF

7 黄颜色FFFF008 黑颜色0000009 海颜蓝 #70DB93

10 巧克力色5C331711 蓝紫色9F5F9F12 黄铜色 #B5A642

13 亮金色D9D91914 棕色A67D3D15 青铜色 #8C7853

16 2号青铜色A67D3D17 士官服蓝色5F9F9F18 冷铜色 #D98719

19 铜色B8733320 珊瑚红FF7F0021 紫蓝色 #42426F

22 深棕5C403323 深绿2F4F2F24 深铜绿色 #4A766E

25 深橄榄绿4F4F2F26 深兰花色9932CD27 深紫色 #871F78

28 深石板蓝6B238E29 深铅灰色2F4F4F30 深棕褐色 #97694F

32 深绿松石色7093DB33 暗木色855E4234 淡灰色 #545454

35 土灰玫瑰红�85636336 长石色D1927537 火砖色 #8E2323

38 森林绿238E2339 金色CD7F3240 鲜黄色 #DBDB70

41 灰色C0C0C042 铜绿色527F7643 青黄色 #93DB70

44 猎人绿215E2145 印度红4E2F2F46 土黄色 #9F9F5F

47 浅蓝色C0D9D948 浅灰色A8A8A849 浅钢蓝色 #8F8FBD

59 浅木色E9C2A660 石灰绿色32CD3261 桔黄色 #E47833

62 褐红色8E236B63 中海蓝色32CD9964 中蓝色 #3232CD

65 中森林绿6B8E2366 中鲜黄色EAEAAE67 中兰花色 #9370DB

68 中海绿色426F4269 中石板蓝色7F00FF70 中春绿色 #7FFF00

71 中绿松石色70DBDB72 中紫红色DB709373 中木色 #A68064

74 深藏青色2F2F4F75 海军蓝23238E76 霓虹篮 #4D4DFF

77 霓虹粉红FF6EC778 新深藏青色00009C79 新棕褐色 #EBC79E

80 暗金黄色CFB53B81 橙色FF7F0082 橙红色 #FF2400

83 淡紫色DB70DB84 浅绿色8FBC8F85 粉红色 #BC8F8F

86 李子色EAADEA87 石英色D9D9F388 艳蓝色 #5959AB

89 鲑鱼色6F424290 猩红色BC171791 海绿色 #238E68

92 半甜巧克力�6B422693 赭色8E6B2394 银色 #E6E8FA

95 天蓝3299CC96 石板蓝007FFF97 艳粉红色 #FF1CAE

98 春绿色00FF7F99 钢蓝色236B8E100 亮天蓝色 #38B0DE

101 棕褐色DB9370102 紫红色D8BFD8103 石板蓝色 #ADEAEA

104 浓深棕色5C4033105 淡浅灰色CDCDCD106 紫罗兰色 #4F2F4F

107 紫罗兰红色CC3299108 麦黄色D8D8BF109 黄绿色 #99CC

/*所有分类右边线*/

.all-cats .link{border-right:1px8C7853solid;}

/*首页/店铺动态右边线*/

.skin-box-bd .menu-list .menu{border-right:1px006205solid;}

/* 导航条背景色*/

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

/*首页/店铺动态背景色*/

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

/*所有分类背景色*/

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

/*所有分类文字颜色*/

.skin-box-bd .all-cats .title{color: #FFFF00}

/*首页/店铺动态文字颜色*/

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

设置导航条颜色的方法：

1、进入卖家中心，点击“店铺装修”，即可进入装修界面。将鼠标放置导航条位置，即可出现编辑按钮，点击“编辑”

2、进入编辑界面后，会出现两个选项，“导航设置”和“显示设置”，“导航设置”就是如下图所示添加或删除导航条的内容，或者将某一项上移或下移。在此重点讲解一下“显示设置”

3、导航条的“显示设置”是通过一些固定的代码来实现设置的。在此我们设置一个导航条的导航条背景色为绿色，首页/店铺动态背景色为白色，首页/店铺动态右边线为墨绿色，首页/店铺动态文字颜色蓝紫色，所有分类背景色牡丹红，所有分类右边线青铜色，所有分类文字颜色黄色。当然这个搭配肯定不会美观的，只是举这么个例子。给位可以根据自己的喜好和美观来搭配颜色。规定好颜色之后，就可以把以下代码编辑到“显示设置”的输入框内。点击“确认”即可完成设置。其中/* */内的文字为注释文字，不影响代码内容。

导航条的作用：

导航条是网页设计中不可缺少的部分，它是指通过一定的技术手段，为网站的访问者提供一定的途径，使其可以方便地访问到所需的内容，是人们浏览网站时可以快速从一个页面转到另一个页面的快速通道。利用导航条，我们就可以快速找到我们想要浏览的页面。

导航条的目的是让网站的层次结构以一种有条理的方式清晰展示，并引导用户毫不费力地找到并管理信息，让用户在浏览网站过程中不至迷失。