0

只是想知道有没有人经历过。我找不到任何具体的答案。我正在尝试在具有背景的跨度上进行缓慢淡入淡出，并且出于某种奇怪的原因，在 Firefox 中，在过渡期间出现了一个边框（通常只有一侧），但在过渡完成后就不存在了。我用纯 CSS 做这个。

这是CSS：

#lab_equip span {cursor:pointer;display:block;height:100%;position:absolute;top:0;background:url(images/lab_active.png) no-repeat;background-size:cover;opacity:0;transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;}
#lb-listen{width:28.06415%;left:0;}
#lb-brainstorm{width:22.1077%;left:28.1%;background-position:35.9% 0% !important;}
#lb-develop{width:28.29324%;right:21.6%;background-position:69.6% 0% !important;}
#lb-212{width:21.53494%;right:0;background-position:99.8% 0% !important;}
#lab_equip span:hover{opacity:1;}

这是HTML：

<div id="lab_txt">
            <div rel="lb-default"><?php $a = new Area('Default Text'); $a->display($c); ?></div>
            <div rel="lb-listen"><?php $a = new Area('Listen Text'); $a->display($c); ?></div>
            <div rel="lb-brainstorm"><?php $a = new Area('Brainstorm Text'); $a->display($c); ?></div>
            <div rel="lb-develop"><?php $a = new Area('Develop Text'); $a->display($c); ?></div>
            <div rel="lb-212"><?php $a = new Area('212 Text'); $a->display($c); ?></div>
        </div>

只是好奇是否有其他人看到过这种情况。它在 Chrome 中运行良好。

感谢您的任何提示！:D

4

0 回答 0