CSS3动画z-index上的图像不起作用

科克

我想在我的CSS3动画上设置图像。因此,我将其z-index:55用于动画图像和z-index:56顶部图像。但是我做不到。

在这里,我想在电视中显示一些动画。因此,对于我而言,用动画代替电视图像非常重要。(对于我的响应性问题,我避免将图像用作背景)

在这里查看我的示例小提琴

中州

那里有多个问题:

  • 正如Terry所说的1-元素必须是糖浆。
  • 2正如alireza safain所说,您需要在两个元素上都定义位置

这样您的小提琴就可以像这样进行更新:

.tv {
 position: relative;
 z-index: 100;
}

https://jsfiddle.net/s9s1mbxv/1/

这会将旋流置于背景中,但仍会在图像上溢出。可以通过在电视上设置大边框并使用顶部/左侧将其向后偏移来部分解决此问题,但这有点愚蠢

.tv {
    position: relative;
    z-index: 100;
    border: 200px solid #fff;
    top: -100px;
    left: -100px;
}

更好的解决方案是在电视图像中添加白色背景。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

CSS3动画不起作用

来自分类Dev

CSS3关键帧动画不起作用

来自分类Dev

CSS3关键帧动画不起作用

来自分类Dev

此动画(css3)在Firefox上不起作用

来自分类Dev

CSS3动画在Firefox中不起作用

来自分类Dev

css3动画不起作用| 非常基本的例子

来自分类Dev

CSS3比例动画不起作用

来自分类Dev

此动画(css3)在Firefox上不起作用

来自分类Dev

CSS3动画在Firefox中不起作用

来自分类Dev

CSS3关键帧动画不起作用

来自分类Dev

CSS3动画在Mozilla中不起作用

来自分类Dev

图像上方的文字CSS Z-Index不起作用

来自分类Dev

为什么我在图像上的CSS动画不起作用?

来自分类Dev

CSS3过渡,悬停以触发子元素上的动画不起作用

来自分类Dev

在服务器上上传CSS3动画不起作用

来自分类Dev

图像悬停不起作用css3

来自分类Dev

CSS3动画的图像比例

来自分类Dev

Li上的CSS3动画删除

来自分类Dev

CSS3在子元素上翻译不起作用

来自分类Dev

CSS3动画-更改动画元素“底面”的图像

来自分类Dev

CSS Z-index不起作用

来自分类Dev

CSS图像不起作用

来自分类Dev

CSS图像不起作用

来自分类Dev

CSS3关键帧动画在Firefox中不起作用

来自分类Dev

CSS3动画过渡:不透明度不起作用

来自分类Dev

如果div:before是浮动的,则CSS3动画不起作用(WebKit)

来自分类Dev

CSS3动画在IE11中不起作用

来自分类Dev

CSS3关键帧动画在Mozilla Firefox中不起作用

来自分类Dev

CSS3动画在Android 4.2上不起作用