如何用css代码让导航条透明化

html-css023

如何用css代码让导航条透明化,第1张

1.进入卖家中心-店铺装修-找到导航栏编辑按钮

2.然后打开编辑,看提示窗口找到(显示设置)点击后看到白框就是CSS自定义框。

3.将下面对应的透明代码复制进去,导航栏就会透明显示。如图:

A.简单的淘宝新旺铺自定义CSS导航透明背景代码:

.skin-box-bd{background:none}

.menu-list{background:none}.link{background:none}

.menu{background:none}

.all-cats{background:none}

.all-cats{display:none}

.menu-list.menu.title{color:#CF6AA6}

B.完全的淘宝新旺铺自定义CSS导航透明背景代码:

.skin-box-bd{background:noneborder:none}

.menu-list{background:none}

.link{background:noneborder:none}

.menu{background:none}

.all-cats{background:none}

.skin-box-bd.all-cats.link{border:none}

.skin-box-bd.menu-list.menu{border:none}

.menu-list.menu.title{color:#000000font-size:15pxfont-weight:bold}

.all-cats.link.title{color:#000000font-size:15pxfont-weight:bold}

.skin-box-bd.menu-list.menu-selected.link{background:none}

.skin-box-bd.menu-list.menu-selected.link.title{background:none}

其实你说的不是很清楚,如果有什么不明白的再说:

首先是css:

 a{ color: #000000}

 a:hover {color: #fff background: #000 }

然后a标签

 <a href="@">点击按钮</a>

这些是a标签的一些样式

a  标签对是一个网站的一条信息链接定义的,a:link {}     /* 未访问的链接 */

a:visited {}  /* 已访问的链接 */

a:hover {}    /* 当有鼠标悬停在链接上 */

a:active {}   /* 被选择的链接 */

然后你下面的我大体的说一下

background:none没有背景;

border:none没有边框;

color:#000000font-size:15pxfont-weight:bold字体颜色是黑色的,大小15像素,加粗

background:transparent。意思就是背景透明。实际上background默认的颜色就是透明的属性。所以写和不写都是一样的

代码如下,放入导航栏的“显示设置”中。

.skin-box-bd{background:transparent}.skin-box-bd .menu-list{background:transparent}.skin-box-bd .menu-list .menu{background:transparentborder:none}.skin-box-bd .menu-list .menu .link{background:transparentborder:none}.all-cats{background:transparent}.all-cats .link{background:transparentborder:none}.skin-box-bd .menu-list .menu .link .title{color:#000000}.all-cats .link .title{color:#000000}.all-cats .link .popup-icon{background:transparent}

我百度空间中有代码生成工具,其中有一项就是关于导航栏CSS代码的,可以自助生成代码,你可以去看看。