風雲論壇脚本中心 → 浏览:帖子主题
* 帖子主题:利用锚点 :target 实现纯 CSS 的 tab 分页切换
風雲 (ID: 3)
头衔:论坛版主
等级:光明使者
积分:494
发帖:31
来自:保密
注册:2022/3/30 15:28:53
造访:2023/1/19 16:21:40
[ 第 1 楼 ] 回复
Google 最新出了一个 :has 选择器,可以很方便的判断子元素属性来确定当前元素的样式,但是Chrome 发明的,暂时还不通用。尝试用 :target 来实现 tab 分页:

[您可以先修改代码再运行]

2022/12/8 9:39:33 IP:已设置保密
風雲 (ID: 3)
头衔:论坛版主
等级:光明使者
积分:494
发帖:31
来自:保密
注册:2022/3/30 15:28:53
造访:2023/1/19 16:21:40
[ 第 2 楼 ] 回复
上面的缺点是必须通过点击触发锚点才能选中第一页。然后想到了一招更好的办法,还是利用 radio 来实现:

[您可以先修改代码再运行]

Edge的 IE 模式测试也通过。
2022/12/8 10:11:54 IP:已设置保密
pojin (ID: 2)
等级:精灵
积分:144
发帖:1
来自:保密
注册:2022/3/30 11:42:27
造访:2023/1/19 16:30:58
[ 第 3 楼 ] 回复
Good!
2022/12/8 16:43:33 IP:已设置保密
分页: 1, 共 1 页
快速回复主题
账号/密码
用户: 没有注册? 密码:
评论内容