导航:首页 > 编程语言 > 淘宝导航栏分割线代码

淘宝导航栏分割线代码

发布时间:2024-05-18 16:39:34

A. 怎么让淘宝店铺导航下面有一条线,加什么css代码

亲, 11月1号,淘宝开通了新版描述页, 在这个版本下, 是跟你这个效果不同的。

真正的效果如下:

这里呢, 有两条线, 上面红色的一条线, 是淘宝自动添加的。 所有店都会有。

下面的蓝色的线,是我自已加的。

加的方法如下:


  1. 设置文档头背景图片, 背景图片的最上方, 做出1PX或2PX的蓝色线条, 淘宝装修后台,设置水平平铺。

  2. 在头部设置DIV的上边框,我的这个蓝线是2PX,高度为120PX。

  3. 具体CSS代码为<div style="height:120px;border-top:1px solid #00f;">这里面是具体的代码,或者文字。</div>

B. 怎么在CSS里设置导航的分割线

设置分割线在我多个的经验施行后,没有一成不变通用的方法,得根据要求采用最适合的。

1、使用字符“|”,适合导航栏间距不一致时,也就是不适合你。

2、采用背景方式,背景图片即是那条间隔线,需要形成jpg、gif、png格式的小图片,在背景里设置居左,并控制一下垂直位移,这样就会出现你第一张图的要求。

3、但最后一项可能会出现没有间隔线的情况,那么就多添加一个空的li或a,这样就多出来一个间隔线,好看。


具体细节需要把握,代码举例:

xlMenua{background:url(menuLine.gif)no-repeat;display:block;width:77px;text-align:center;float:left;}
.xlMenua.first{width:43px;background:none;text-align:left;}

效果:

很小很小的一条线。。。

C. 杩欑嶇綉椤靛艰埅鏍忥紝鏍忕洰涓闂存湁鈥滀辅鈥濆垎鍓茬嚎锛屽備綍鍦╤tml閲屽疄鐜帮紵锛圖IV+CSS甯冨眬闂棰橈級

鍩烘湰灏辨槸杩欎箞骞茬殑锛佷綘闃斾互鍙傝冧竴涓嬶紒

<!doctypehtml>
<html>
<head>
<metacharset="utf-8">
<title>test</title>
<styletype="text/css">
ol,ul{
list-style:none;
}
#main{
margin:20pxauto;
width:800px;
height:40px;
background:blue;
}
#mainli{
width:100px;
height:20px;
font-weight:600;
color:#FFFFFF;
border-right:1pxsolid#ffffff;
text-align:center;
line-height:20px;
margin-top:10px;
margin-right:5px;
float:left;
}
</style>
</head>

<body>
<ulid="main">
<li>棣栭〉</li>
<li>鏂伴椈涓蹇</li>
<li>浼佷笟绠浠</li>
<li>鏂伴椈涓蹇</li>
<li>浼佷笟绠浠</li>
</ul>
</body>
</html>

D. 淘宝导航条的黑线怎么去掉

分割线没办法去除,不过可以改变颜色,改成和导航条一样的颜色 效果也一样

1、一级导航分类(除去“所有宝贝”分类)分隔线颜色代码如下:代码前面还有个小点点哦 别漏掉了

.menu-list .menu{border-color:#000000;}

阅读全文

与淘宝导航栏分割线代码相关的资料

热点内容
安卓充电线拆解 浏览:440
移动大王卡怎么选择app 浏览:204
电脑没连接网络怎么连接打印机 浏览:63
怎么能找出手机锁屏的app 浏览:729
u盘temp文件夹可以删除吗 浏览:84
卸载dota2用哪个文件 浏览:602
qq上看视频文件怎样不显示 浏览:968
win10文件夹共享防火墙设置 浏览:829
win10重新分区恢复 浏览:332
离线的恢复文件的软件 浏览:366
linux查看进程锁 浏览:93
调频斜率matlab代码 浏览:756
苹果的隐藏的文件夹 浏览:382
cad如何设置文件自动保存 浏览:742
联想无线网络管理 浏览:3
大疆Mac固件升级 浏览:503
如何将linux文件复制 浏览:560
数控编程计算器哪个好 浏览:614
美颜app怎么拍证件照 浏览:181
西藏生死书版本 浏览:735

友情链接