html选择数量,控制标签的显示数量—css3: nth-child()

需求:

①前端页面最多显示三个tag,多余的在代码中全部显示。

②且在调用接口的时候也要起作用,后端到时会将全部数据渲染出。

html部分:

 
 

1

2

3

4

5

6

css部分:

 
 

结果:(只显示3个,第三个开始隐藏掉了)

附:

css3:nth-child选取第几个标签元素

选择标签选择第几个

nth-child(3)选择第3个

nth-child(2n)选择偶数标签

nth-child(2n-1)选择奇数标签

nth-child(n+3)选择从第3个标签开始到最后

nth-child(-n+3)选择从第0到3,即小于3的标签

文章来源:田珊珊个人博客

来源地址:http://www.tianshan277.com/717.html

申请创业报道,分享创业好点子。点击此处,共同探讨创业新机遇!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值