Создание обратного отсчета

Question

Я не уверен, как изменить шрифт, размер и цвет слов на этом.

<script type="text/javascript"> 
    var end = new Date('02/19/2012 10:1 AM'); 

    var _second = 1000; 
    var _minute = _second * 60; 
    var _hour = _minute * 60; 
    var _day = _hour * 24; 
    var timer; 

    function showRemaining() { 
     var now = new Date(); 
     var distance = end - now; 
     if (distance < 0) { 

      clearInterval(timer); 
      document.getElementById('countdown').innerHTML = 'EXPIRED!'; 

      return; 
     } 
     var days = Math.floor(distance/_day); 
     var hours = Math.floor((distance % _day)/_hour); 
     var minutes = Math.floor((distance % _hour)/_minute); 
     var seconds = Math.floor((distance % _minute)/_second); 

     document.getElementById('countdown').innerHTML = days + 'days '; 
     document.getElementById('countdown').innerHTML += hours + 'hrs '; 
     document.getElementById('countdown').innerHTML += minutes + 'mins '; 
     document.getElementById('countdown').innerHTML += seconds + 'secs'; 
    } 

    timer = setInterval(showRemaining, 1000); 
</script> 
<div id="countdown"></div> 

Answer 1

Попробуйте этот пример:

Просто добавьте новую строку кода:

document.getElementById('countdown').style.cssText = 'color: green; font-size: 40px;';

Это поможет вам определить любой стиль, который вы хотите.

var end = new Date('02/19/2017 10:1 AM'); 
 

 
var _second = 1000; 
 
var _minute = _second * 60; 
 
var _hour = _minute * 60; 
 
var _day = _hour * 24; 
 
var timer; 
 

 
function showRemaining() { 
 
    var now = new Date(); 
 
    var distance = end - now; 
 
    if (distance < 0) { 
 

 
     clearInterval(timer); 
 
     document.getElementById('countdown').innerHTML = 'EXPIRED!'; 
 

 
     return; 
 
    } 
 
    var days = Math.floor(distance/_day); 
 
    var hours = Math.floor((distance % _day)/_hour); 
 
    var minutes = Math.floor((distance % _hour)/_minute); 
 
    var seconds = Math.floor((distance % _minute)/_second); 
 

 
    document.getElementById('countdown').style.cssText = 'color: green; font-size: 40px;'; 
 
    document.getElementById('countdown').innerHTML = days + ' days '; 
 
    document.getElementById('countdown').innerHTML += hours + ' hrs '; 
 
    document.getElementById('countdown').innerHTML += minutes + ' mins '; 
 
    document.getElementById('countdown').innerHTML += seconds + ' secs'; 
 
    
 
} 
 

 
timer = setInterval(showRemaining, 1000);

<span id="countdown"></span>

Как заметил @andlrc, вы можете сделать это без JavaScript. Используйте стили CSS. Добавьте новый стиль на страницу html

<style type="text/css"> 
    #countdown { 

     color: green; 
     font-size: 40px; 
    } 
</style> 
<span id="countdown"></span>