Как сделать календарь в JS? В HTML нам поднадобиться всего лишь один div с классом container: <div class="container"></div> Вся оснавная работа будет в js. Сначала необходимо создать функцию, которая будте корректировать дату т.к. в js день недели начинается с воскресенья, а нам привычнее видеть стандарт даты с понедельника:    function getDay(date){    let day = date.getDay();    if(day == 0) day = 7    return day-1    } Далее мы прописываем основную функцию:    function createCalender(elem, year, month){    elem = document.querySelector(elem) // сюда при вызоые мы будем записывать элимент, в который будет вложен календарь    let mon = month - 1 // т.к. js считает январь нулевым месяцем    let d = new Date(year, mon)    let table = `    <table>    <caption>${month}.${year}</caption> //заголовок таблицы    <tr>    <th>пн</th>    <th>вт</th>    <th>ср</th>    <th>чт</th>    <th>пт</th>    <th>сб</th>    <th>вс</th>    </tr>    <tr> //не закрываем теги таблицы и tr т.к. затем пропишем циклы, которые будут записывать дни    `;    for (let i = 0; i<getDay(d); i++){   //пустые ячейки, если месяц начинается не с понедельника    table += `<td></td>`    }    //гениратор дней    while (d.getMonth() == mon){    table += '<td>' + d.getDate() + '</td>'    if (getDay(d) % 7 == 6){    table += '</tr><tr>'    }    d.setDate(d.getDate() + 1)    }    if (getDay(d) != 0){    for (let i = getDay(d); i<7; i++){  //пустые ячейки если месяц заканчивается не воскресеньем    table += `<td></td>`    }    }    table += '</tr></table>' // закрываем таблицы    elem.innerHTML = table // добавляем код HTML в таблицу    } И вызываем функцию, передав в нее параметры (расположение, год, месяц) createCalender('body', 2023, 4) Таблице мы также можем добавить несколько стилей в css: .container {   display: flex;   flex-wrap: wrap; } table {   border-collapse: collapse;   margin-bottom: 10px;   margin-right: 10px; } caption {   padding: 10px 0;   background-color: rgb(69, 154, 69);   border: 1px solid black;   border-bottom: none; } td, th {   border: 1px solid black;   padding: 8px;   text-align: center;   font-size: 18px; } th {   font-weight: bold;   background-color: rgb(47, 112, 47); }

Что такое и зачем нужен <div> В вёрстке есть очень удобный HTML-тег — <div>. С его помощью обозначают блок, который не оформлен сам по себе, но может задавать оформление и структурировать веб-страницу. Изначальная задача этого тега — собрать в кучу другие теги, чтобы получилось что-то единое, с чем можно работать как с одним объектом. Тег <div> появился в стандарте HTML3 в 1995 году, и на тот момент это было мощным решением: верстальщики получили возможность применять стили сразу к группе тегов. Ещё этим тегом решилась другая проблема — табличная вёрстка. Раньше всё верстали на таблицах, потому что по-другому реализовать нарисованный дизайн просто не получалось. Всё рассовывалось по ячейкам таблиц, и таблицы вкладывались друг в друга. Поддерживать такое было сложно. С появлением <div> все перешли на блочную вёрстку, которая работает так: 1. Верстальщик создаёт блок на странице и наполняет его содержимым. 2. В стилях он указывает, как этому блоку выглядеть и вести себя по отношению к другим — например, отталкивать, отступать, заставлять перенестись на новую строку и т. д. 3. Блоки можно вкладывать друг в друга сколько угодно раз, причём для каждого блока-контейнера можно задавать свои стили и поведение. В итоге получилось то же самое, что с табличной вёрсткой, но уже на блоках. Главный плюс в том, что блоки гораздо более автономны, чем ячейки таблицы, поэтому такой подход сейчас считается основным для вёрстки. В чем проблема div и почему некоторые разработчики ругают такую вёрстку, рассказываем в статье: v.thecode.media/...mmu