CSS-计时器插件不会显示完整

Question

所以我在此页面上工作：http://dealsgoneape.com/test-timer/

乍看之下，您只会看到“ DAYS”和“ HOURS”，但是如果您在Chrome上打开控制台或检查器工具，则会显示“ Days，Minutes，Hours，Seconds”。

我想知道为什么。因此，我尝试通过在CSS上放置以下代码并使用检查器工具来试用HMTL：

soon[data-layout*=group] .soon-group-sub>.soon-group-inner{
   margin: 0 0.35em;
}


#frb_timer_643221721_timer .soon-label{
   width: 300px; 

}

span.soon-group-inner{
     border: 2px solid red;
  display: block;
}

但是，无论我如何选择元素，只要不打开Chrome上的控制台或检查器工具，它们就不会显示整个计时器。

请帮助！随时在Chrome或firefox上打开检查器工具即可实时观看此视频。

Answer 1

添加此CSS，以强制display:none div显示inline block

span.soon-group.soon-group-sub{ 
     display:inline-block !important;
}

输出：

Answer 2

我发现此页面使用FlipClock插件：http://flipclockjs.com/faces/daily-counter

如果您想以“正确”的方式进行操作，建议您阅读插件文档。这是显示所有数字的方法：

var clock = $('.clock').FlipClock(3600 * 24 * 3, {
   clockFace: 'DailyCounter',
   countdown: false
});

Answer 3

我相信您在此处使用的是基于jQuery的动画响应式快速倒计时v1.9.0 。因此，在构建器中创建计时器时，可以将“格式”设置为也显示“分钟和秒”。就像下图所示：