Форматирование вывода 2-минутного таймера обратного отсчета

Question

Я хочу сделать стандартный двухминутный обратный отсчет до go с цитатой на сайте «Каждые две минуты ребенок входит в систему в США». У меня есть этот код, и я хочу увеличить результат, полужирный и другой шрифт. Что и где мне добавить эту информацию? Извините, я знаю, что это такой базовый c вопрос, но буду признателен за помощь!

<div id=timer></div>
<script type="text/javascript">
var timeoutHandle;
function countdown(minutes, seconds) {
    function tick() {
        var counter = document.getElementById("timer");
        counter.innerHTML =
            minutes.toString() + ":" + (seconds < 10 ? "0" : "") + String(seconds);
        seconds--;
        if (seconds >= 0) {
            timeoutHandle = setTimeout(tick, 1000);
        } else {
            if (minutes >= 1) {
                // countdown(mins-1);   never reach “00″ issue solved:Contributed by Victor Streithorst
                setTimeout(function () {
                    countdown(minutes - 1, 59);
                }, 1000);
            }
        }
    }
    tick();
}

countdown(2, 00);
</script>

Answer 1

Дайте div из таймера имя класса, а затем добавьте стиль в свой CSS.

var timeoutHandle;
function countdown(minutes, seconds) {
    function tick() {
        var counter = document.getElementById("timer");
        counter.innerHTML =
            minutes.toString() + ":" + (seconds < 10 ? "0" : "") + String(seconds);
        seconds--;
        if (seconds >= 0) {
            timeoutHandle = setTimeout(tick, 1000);
        } else {
            if (minutes >= 1) {
                // countdown(mins-1);   never reach “00″ issue solved:Contributed by Victor Streithorst
                setTimeout(function () {
                    countdown(minutes - 1, 59);
                }, 1000);
            }
        }
    }
    tick();
}

countdown(2, 00);

.timer {
  font-weight: bold;
  font-size: 30px;
  font-style: italic;
}

<div timer id='timer' class=timer></div>

Вы можете включить css -файл с <link rel="stylesheet" type="text/css" href="style.css"/> в свой HTML -файл.

Альтернатива: Вы можете использовать встроенный CSS:

<div timer id='timer' style="font-weight: bold; font-size: 30px; font-style: italic;"></div>

Но это решение не рекомендуется . Разделять HTML, CSS и JavaScript в разных файлах - это хороший вариант.