css - :nth-child(n)选择器中的n可不可以引用到属性中？-PHP中文网问答

文章专题 AI工具学习下载问答源码最近更新

PHP

会员中心讲师中心微信公众号

css - :nth-child(n)选择器中的n可不可以引用到属性中？

PHP中文网 2017-04-17 11:09:25

[CSS3讨论组]

909

如果是原生的CSS（不使用编译器）可不可以达到这样的效果？
或者有没有哪个属性或方法是可以使数值与n相关的？

.box:nth-child(n){
    -webkit-animation-delay:n s;
            animation-delay:n s;
}

PHP中文网

认证高级PHP讲师

全部回复(2)

黄舟2017-04-17 11:11:25 2楼

在原生的基础上，部分 Firefox 浏览器可以实现 CSS 变量

element {
  --animation-delay: 3s;
} 

.box:nth-child(n) {
-webkit-animation-delay: var(--animation-delay);
        animation-delay: var(--animation-delay);
}

详情看 MDN 的文档 https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables

赞 +0

添加回复

怪我咯2017-04-17 11:11:25 1楼

不行
nth-child(n) 中的n可以是an+b形式，或odd，even或数字，所以不应该被作为变量使用
你要实现的效果应该用js实现
或者可以使用一些支持变量的css预处理语言

赞 +0

添加回复

专题推荐

更多>

热门话题

热门教程

更多>

最新下载

更多>

网站特效

网站源码

网站素材

前端模板

关于我们免责申明意见反馈讲师合作广告合作最新更新: php中文网：公益在线php培训，帮助PHP学习者快速成长！; 关注服务号技术交流群

app下载

PHP中文网订阅号: 每天精选资源文章推送

PHP中文网APP: 随时随地碎片化学习

PHP中文网抖音号: 发现有趣的

PHP学习

技术支持

返回顶部