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

html-css013

如何用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}

有很多中方法,如果是全透明,那么最简单的方法(以默认模板为例子)是找到:

.modbox 模块内容区{padding:10px 10px 0 10pxbackground-color:#FFFFFF}

.modtl 模块左上角背景{background:url(temp1/ptitl.gif) no-repeat top leftline-height:1px}

.modtc 模块中上背景{background:url(temp1/ptitc.gif) repeat-x}

.modtr 模块右上角背景{background:url(temp1/ptitr.gif) no-repeat top rightline-height:1px}

.modbl 模块左下角背景{background-color:#FFFFFFline-height:1px}

.modbc 模块中下背景{background-color:#FFFFFFline-height:1px}

.modbr 模块右下角背景{background-color:#FFFFFFline-height:1px}

这几行代码(开头的相同即可以,大括号里的可能有点不相同),把background-color:#FFFFFF/*背景色*/ 和 background:url(temp1/ptitr.gif) /*背景图片*/的#FFFFFF和括号里的图片地址去掉,这样,所有的模块就变成了透明的,因为没有背景色也没有背景图片.

如果还不透明的话,那就把

.stage空间主体{background-color:#FFFFFF}的像#FFFFFF一类的颜色代码和像background:url()之类的括号里面的图片地址去掉.

因为CSS是分层的,模块的代码在主体代码的上面,两层是叠加在一起的,所以说这两层的背景色和背景图片的代码都要去掉,那么才会显示出最下面一层的body的背景色和背景图片.这种办法是最简单的一种了.还有不少的办法.