|
主题:★★CSS实现★★新闻列表链接★★隔行变色★★的方法 [收藏主题] | 转到: |
最近制作一个网站,由于网站的设计稿是客户自行设计的。由于设计人员是平面设计师,对网页设计中与程序搭配的部分不是很了解,因此设计难免天马行空。 其中一点便是新闻列表使用了隔行变色。 注意,这里不是说背景隔行变色,而是列表链接隔行变色。效果如下图: 其中的文字链接是一行白色,一行粉红色。(背景部分使用双行图片背景在UL中平铺即可,本教程不做讲解。) 怎么解决这个问题呢?还好,科讯的自定义标签中有一个特别灵活的参数:{@autoid},也就是行号。 于是编写代码如下:
配合CSS很好的解决了这个问题,CSS如下: 以下内容只有回复后才可以浏览,请先登录! 原理非常简单,那就是用行号给别一行都加上一个单独的class样式,然后在CSS中分别控制即可。 本来问题到此就算是结束了。但是做到后面发现搜索页面也是使用的这样的格式。。。 而科讯的全站搜索中是没有“行号”这个参数的。问题似乎遇到了瓶颈。尔后我尝试修改科讯的程序来解决这个问题。。。无奈,我对ASP语言一窍不通。。。不了了之。。。 但是问题还是必须解决。我突然想起了一个非常牛B的CSS选择器。然后用这个选择器解决了这个问题。唯一的缺憾是,不支持IE6浏览器。。 搜索部分代码如下:
CSS如下:
你没看错,使用的就是“ + 号选择器”,在一般的教程中称之为“临近选择器”。 他的意思是说: 第一个li中的链接使用白色 在第一个li后面的一个li中的链接使用粉红色 在第一个li后面的一个li的后面的一个li中的链接使用白色 以此类推
上面的CSS中的这一个,后面有一个下划线的颜色为黑色,是使用了一个hack用来解决IE6浏览器的不兼容问题的。在IE6中,所有的链接使用黑色,以避免白色看不见的问题。 到此,这个问题算是解决了。虽然有一点缺憾,但是复习了一下这么牛B的选择器。。。还是很好的。。 就是这样的写法非常啰嗦。。。。希望科讯官方可以在为标签增加更多的自定义选项,解决诸如此类的问题。那便是善莫大焉了。 |
|
支持(0) | 反对(0) 顶端 底部 |
孤风自己开发了一套CMS系统,博采科讯的长处,去除了无关的功能,有兴趣的百度 FengCms | |
支持(0) | 反对(0) 顶端 底部 |
支持(0) | 反对(0) 顶端 底部 |
支持(0) | 反对(0) 顶端 底部 |
支持(0) | 反对(0) 顶端 底部 |
fuzhouhuodai23 发表于:2011/6/21 18:55:24 | 只看该作者 查看该作者主题
地板
|
|
支持(0) | 反对(0) 顶端 底部 |
支持(0) | 反对(0) 顶端 底部 |
adsl600819298 发表于:2011/6/27 0:40:32 | 只看该作者 查看该作者主题
8楼
|
|
支持(0) | 反对(0) 顶端 底部 |
支持(0) | 反对(0) 顶端 底部 |
支持(0) | 反对(0) 顶端 底部 |
<上一主题 | 下一主题 > |