蓝叶博客

青春是一个充满活力的季节,即便是我们失去了天使的翅膀,只要我们还有一颗青春的心,那么我们的生活依然能够如阳光般灿烂!......
现在位置:首页 > 网站设计 > 两种方法为LI列表前3行设置样式

两种方法为LI列表前3行设置样式

蓝叶    网站设计    2014-06-18    5735    10评论    已收录

在设计网页模板的时候,为了突出信息的重要性以及美观度,我们会设置一些样式使LI文章列表的前3行加上不同的样式,例如给LI文章列表的前3行文字颜色设置红色,再例如图片列表的时候设置列表第一张图片、第二张图片等的宽和高,都可以用蓝叶分享的这两种方法为LI列表设置样式;对于懂PHP语言的设计者来说,很容易就可以实现的效果,对于不懂PHP语言的可以使用这两种方法也很轻松的实现自己想要的各种效果。

#newlog li:nth-child(1) a{color:red;}
说明:上面的CSS样式设置样式名为#newlog下面的li列表中第一行的a标签文字颜色为红色;如果要设置第二行或者第二行,修改里面的1为2或者3就行了,以此类推。

<script type="text/javascript">  
$(document).ready(function(){
 $('#newlog li:eq(0) a').css('color','red');
});
</script>
说明:这是JQ的方式给样式名为#newlog下面的li列表中第一行的a标签设置字体颜色为红色;JQ的方式中0就是第一行,如果第二行则是1,以此类推。

评论一下 分享本文 赞助蓝叶

赞助蓝叶X

扫码赞助蓝叶
联系站长
蓝叶博客
挤眼 亲亲 咆哮 开心 想想 可怜 糗大了 委屈 哈哈 小声点 右哼哼 左哼哼 疑问 坏笑 赚钱啦 悲伤 耍酷 勾引 厉害 握手 耶 嘻嘻 害羞 鼓掌 馋嘴 抓狂 抱抱 围观 威武 给力
提交评论

清空信息
关闭评论
IE下不兼容
IE下不兼容2015-02-03 17:02回复
#8
IE下不兼容
蓝叶
蓝叶2015-02-03 18:23回复
@IE下不兼容:IE浏览器过时了。
中国历史
中国历史2014-11-19 12:15回复
#7
这属于前端吧,感觉挺有意思
知道91
知道912014-11-11 00:17回复
#6
不错,这是个好方法,看来博主是css高手啊,现在的大学生都屑于做css,可是这些东西是很有用的
网站建设
网站建设2014-09-22 17:55回复
#5
不明觉厉,打个酱油
假日生活指南
假日生活指南2014-09-05 13:37回复
#4
话说能不能开发成插件呢?亲还有就是可以开发个置顶插件么?比如:置顶的有一级置顶二级置顶这样的区别,便于访客观察哪篇文章的重要性!现在的置顶都不能满足要求了
蓝叶
蓝叶2014-09-11 15:37回复
@假日生活指南:EMLOG没有这些功能
互推之家
互推之家2014-07-31 15:39回复
#3
博主实在是个厉害的人物
民间偏方大全
民间偏方大全2014-07-20 23:07回复
#2
谢谢博主分享
免费部落
免费部落2014-07-01 08:57回复
#1
原来是这样的!
快捷导航返回顶部
你问我答
技术QQ群
音乐QQ群
付费服务
音乐欣赏
友情链接
保存桌面
给我留言
返回顶部