小编Sek*_*eka的帖子

我试图通过将动画应用于每个子元素来创建级联效果.我想知道是否有更好的方法来做到这一点:

.myClass img:nth-child(1){
    -webkit-animation: myAnimation 0.9s linear forwards;
}
.myClass img:nth-child(2){
    -webkit-animation: myAnimation 0.9s linear 0.1s forwards;
}
.myClass img:nth-child(3){
    -webkit-animation: myAnimation 0.9s linear 0.2s forwards;
}
.myClass img:nth-child(4){
    -webkit-animation: myAnimation 0.9s linear 0.3s forwards;
}
.myClass img:nth-child(5){
    -webkit-animation: myAnimation 0.9s linear 0.4s forwards;
}

等等......所以基本上,我想为每个孩子制作一个动画,但是会有延迟.感谢您的任何意见!

另外:也许我没有正确解释我的担忧:无论我有多少孩子,这都是关于如何做到的.如何做到这一点,而不必写下每个孩子的属性...例如,当我不知道将有多少孩子.

我想知道是否可以像这样使用百分比值:

@keyframes myAnimation {
    0%    { height: 100px; }
    33.3% { height: 120px; }
    66.6% { height: 140px; }
    100%  { height: 200px; }
}

它似乎工作,但我不确定浏览器是否只是"圆"这个？那么像33.3457%这样的价值呢？非常感谢!

在CSS中使用box-sizing:border-box时,我假设元素的总宽度将在其"width"值中定义.因此,如果我说分区的宽度是20px而右边界是10px,我最终将得到一个占据20px空间的盒子,其中一半是右边界.将它推到我将宽度设置为10px和右边框的位置,就像这里:

#box{
    overflow: hidden;
    width: 10px;
    box-sizing: border-box;
    height: 100px;
    background: black;
    border-right: 10px solid red;
}?

盒子只包含红色边框.当我将宽度设置为0px时会发生什么？我认为它会让整个事情消失,但不会,结果与上面的结果完全相同:jsFiddle

我的问题是,这是否是预期的行为.似乎与我不一致.我想让一个盒子消失,只能操纵宽度/高度.感谢您的任何意见.

我想做以下事情:给定一个带透视的容器和一个带有translateZ值的内部元素,我想用translateY"拉起来"以便在视觉上触摸周围容器的顶部:http:// jsfiddle达网络/ 8R4ym/129 /

是否存在某种公式,给定容器的透视值,元素的宽度和高度以及它的Z-平移我可以得到那种"顶部"计算？我一直在玩它,但我似乎无法找到它的一些规则,因为似乎这些都是变量.

谢谢你的帮助.