translateZ不适用于Firefox

时间:2017-10-07 21:19:06

标签: html css3 firefox css-transforms

我一直试图隐藏一个子元素" list"在父元素后面" div2"使用translateZ。它在chrome中非常有效但在firefox上却没有。有些人请帮帮忙。

链接到JSFiddle。 translateZ on firefox

inflow = list(map(int, input().split(" ")))
result = 0
for i in inflow:
    result += i
print(result)

请在此处找到Image Link

的图片

左侧的图像在chrome上正常工作。黄色酒吧在红色div后面。右边的图像来自firefox,其中黄色条位于红色div的前面 - 这是不期望的。

1 个答案:

答案 0 :(得分:1)

The transform-style: preserve-3d; isn't inherited,必须将其设置为层次结构中的每个后代,以使它们保持在相同的3D空间中。

您已在#div1#div2中保留了3D继承,但未保留在.sub.list.sub孙子,所以你希望Z-move的.list grandgrandchild的血统被破坏了。

如果您将其添加到.sub { height: 20px; width: 50px; background-color: black; transform-style: preserve-3d; } CSS,它会将其子n <- 1000 xcat <- sample(x = c("A","B", "C", "D", "E"), size = n, replace = TRUE, prob = rep(1/5, 5)) #(a) xcont <- rnorm(n, 23, 4) dat <- data.frame(xcat, xcont) for(i in 1:200){ col_new <- paste0("x", i) dat[, col_new] <- rnorm(n, 2+i*2, i) } names(dat)[1:4] 接受到3D空间并应用Z变换。

Slot