gpt4 book ai didi

html - 我需要两个数字并排动画从上到下以及为什么需要位置 :absolute with animation

转载 作者:行者123 更新时间:2023-11-28 13:04:25 24 4
gpt4 key购买 nike

我需要两个数字并排动画从上到下但它不起作用。如果我在 .f_circleG 类中设置 postion:absolute 它的工作但不是并排。另一个问题是为什么需要 postions:absolute 和动画。下面是我的 HTML 和 CSS 代码。

<style type='text/css'>

ul, ul li { list-style:none; display:inline; }

.f_circleG{
position:absolute;
background-color:#FFF;
animation:f_fadeG 1.00s infinite;
}

@-moz-keyframes f_fadeG {
0%{ background-color:transparent; top:0px;}
100%{ background-color:transparent; top:100%; }
}

</style>

</head>
<body>
<div id="floatingCirclesG">
<ul>
<li class="f_circleG">1</li>
<li class="f_circleG">2</li>
</ul>
</div>

</body>

最佳答案

http://jsfiddle.net/teZdz/

希望这能解决你的问题

html

<div id="floatingCirclesG">
<ul>
<li class="f_circleG">1</li>
<li class="f_circleG">2</li>
</ul>
</div>

CSS

ul, ul li { list-style: none; display: inline; }

#floatingCirclesG { height: 200px; }

.f_circleG { position: relative; display: inline-block; -webkit-animation: f_fadeG 1.00s infinite; }

@-webkit-keyframes f_fadeG {
0% {top:0px;}
100% {top:100%;}
}

关于html - 我需要两个数字并排动画从上到下以及为什么需要位置 :absolute with animation,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15942364/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com