找回密码
 注册

QQ登录

只需一步,快速开始

查看: 1290|回复: 8

一个LIST问题,不要LIST最下面的线。

[复制链接]
发表于 2010-9-28 17:15:16 | 显示全部楼层 |阅读模式
一个纠结的问题,如附件所示:
上面的四个都要下边线,到最后面的一个不要显示下边线,这个用CSS怎么写?请教一下各位!先谢谢了~!
333-2.jpg
发表于 2010-9-28 17:30:50 | 显示全部楼层
最后一个li单独加个class把线去掉就可以
回复 支持 反对

使用道具 举报

 楼主| 发表于 2010-9-28 17:47:49 | 显示全部楼层
如果是静态页面当然可以这样,但是那些列表都是用程序循环的。
回复 支持 反对

使用道具 举报

发表于 2010-9-28 17:50:24 | 显示全部楼层
提示: 作者被禁止或删除。
回复 支持 反对

使用道具 举报

发表于 2010-9-28 17:52:37 | 显示全部楼层
提示: 作者被禁止或删除。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2010-9-29 09:37:28 | 显示全部楼层
用CSS 3.0的结构性伪类标签:last-child 实现了!

代码是这样子滴:



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
.aa{ font-size:14px; background-color:#CCC; border-bottom:1px solid #000; height:30px; line-height:30px;}
.aa:last-child {color:#FF0000; border-bottom:0;}

</style>
<title>结构性伪类 E:last-child</title>
</head>

<body>
<div class="aa">匹配父元素中最后一个E元素</div>
<div class="aa">匹配父元素中最后一个E元素</div>
<div class="aa">匹配父元素中最后一个E元素</div>
<div class="aa">匹配父元素中最后一个E元素</div>
<div class="aa">匹配父元素中最后一个E元素</div>

</body>
</html>
回复 支持 反对

使用道具 举报

 楼主| 发表于 2010-9-29 09:37:58 | 显示全部楼层
不过就是IE6\7不支持,狐狸,谷歌跟手机模拟器上都可以。
回复 支持 反对

使用道具 举报

发表于 2010-9-29 11:37:31 | 显示全部楼层
既然是程序循环的,那应该支持if和i行号吧?判断一下行号=10,就显示list-style:none;
回复 支持 反对

使用道具 举报

发表于 2010-9-29 13:16:55 | 显示全部楼层
要是程序循环出来的话,那也简单你只需要设置一个class来去除下划线,告诉程序员就ok了,他们会在循环的时候做判断,还是自己写的话那就用js!
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

小黑屋|Archiver|手机版|blueidea.com ( 湘ICP备19000417号-2 )

GMT+8, 2021-4-20 14:40 , Processed in 0.061107 second(s), 11 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表