淘宝新2012旺铺店铺装修导航css设置教程
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
淘宝新2012旺铺店铺装修导航css设置教程
整个淘宝页面
样式和背景颜色设置
在
左侧装修
下面可看到
在装修样式中可选。自己喜欢的样式和背景颜色
所有页面都可以设置
导航颜色设置
以下文字内容可以一同复制使用,不会影响到使用效果哦!
/* 导航条背景色*/
.skin-box-bd .menu-list{background: none repeat scroll 0 0 #00ad08;}
/*首页/店铺动态背景色*/
.skin-box-bd .menu-list .link{background: none repeat scroll 0 0 #00ad08;} /*首页/店铺动态右边线*/
.skin-box-bd .menu-list .menu{border-right:1px #006205 solid;}
/*首页/店铺动态文字颜色*/
.skin-box-bd .menu-list .menu .title{color:#ff0000}
/*所有分类背景色*/
.all-cats .link{background: none repeat scroll 0 0 #00ad08;}
/*所有分类右边线*/
.all-cats .link{border-right:1px #006205 solid;}
/*所有分类文字颜色*/
.skin-box-bd .all-cats .title{color:#ff0000}
看一下效果哦!【用了红绿配,赛狗屁的颜色。让大家可以更加深刻的对比代码中的颜色。】
红#FF0000
绿#00FF00
蓝#0000FF
橙色#FF7f00
黑#000000
白#FFFFFF
其他可在DREAM WEAVER 中查看。颜色器
【设置导航文字的背景,因为系统中默认有很多地方有背景,所以这个地方需要覆盖完全】.tshop-pbsm-shop-nav-ch .link{
background-color: #F37C06;
background-image: none;
}
【设置文字颜色】
.tshop-pbsm-shop-nav-ch .title{
color: white;
}
tshop-pbsm-shop-nav-ch 和 .title, .link…. 这些就是css的选择器,代表我想把哪个背景色或者文字颜色应用在哪个元素上面。看看效果:
几行CSS,你的导航就是另外一种风格了。
但这个时候,我想让“所有分类有不同的展现,来突出这个地方,吸引下买家,.tshop-pbsm-shop-nav-ch .all-cats-trigger .title{
font-family:微软雅黑;
font-size:16px;
color:black;
}
我把字体调整的大一点,然后设置成黑色了。
其他的区域可参看。淘宝官方教程