Найти в Дзене
Статьи
Таймер до нового года на HTML, CSS, JS.
ТЗ - Создайте HTML-страницу в выведенной на нее информацией сколько осталось до нового года с момента запуска кода. <body> <div class="timer"> <h1>До Нового года осталось:</h1> <div class="d"><p id="day"></p> <p class="da">Дней</p> </div> <div class="w"><p id="Watch"></p> <p class="wa">Часов</p> </div> <div class="m"><p id="Min"></p> <p class="mi">Минут</p> </div> <div class="s"><p id="Sec"></p> <p class="se">Секунд</p> </div> </div> </body><body> <div class="timer"> <h1>До Нового года осталось:</h1>...
7 месяцев назад
Валидация введенных данных пользователем на HTML, CSS, JS.
ТЗ - Создать HTML-страницу и форму для ввода имени. Запретить вводить в форму числа. <body> <form> <ul> <li> <legend for="usern"><span>Введите свое имя:</span></legend> <input type="text" id="usn" oninput="chekI()"> </li> </ul> </form> </body> ul li{ list-style-type:none; } function chekI(){ let input = document...
7 месяцев назад
Двигающийся квадрат на HTML, CSS, JS.
ТЗ - создать HTML-страницу и на ней квадрат, который перемещается по нажатию ПКМ. <body onclick="moveMovve(event)"> <div id="movve"></div> </body> div{ width:50px; height:50px; background:red; position:absolute; } body{ position:relative; height:1000px; } function moveMovve(e){ movve...
7 месяцев назад
Модальное окно на HTML, CSS, JS.
ТЗ - Создать HTML-страницу и добавить на нее кнопку, которая будет открывать модальное окно. <body> <button id='openBtn'>Открыть</button> <div id='modalOverlay' class="modal_overlay"> <div class="modal"> <p>Модальное окно</p> <button id='closeBtn'>Закрыть</button> </div> </div> </body> .modal_overlay{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); display: none; } .modal { background: white; margin-left:40%; margin-top:1%; padding-bottom:20px; border-radius: 8px; width: 200px; height: 80px; text-align: center; box-shadow: 0 2px 10px rgba(0,0,0,0...
7 месяцев назад
Всплывающие подсказки на HTML, CSS, JS.
ТЗ - создать HTML-страницу и разместить на ней несколько кнопок. При наведении на кнопку должна появляться подсказка сверху или, если нет места, снизу. <body> <div class="modal1"><button id="btn1">Кнопка 1</button> <div id="podsk1"><p>кнопка 1</p></div></div> </br> <div class="modal2"><div id="podsk2"><p>кнопка 2</p></div> <button id="btn2">Кнопка 2</button></div> <div class="modal3"><div id="podsk3"><p>кнопка 3</p></div> <button id="btn3" >Кнопка 3</button></div> </body> #podsk1, #podsk2, #podsk3{...
7 месяцев назад
Светофор на HTML, CSS, JS.
ТЗ - необходимо создать HTML-страницу, на которой будет отображаться светофор и кнопка для переключения цветов. При нажатии на кнопку цвета должны меняться по порядку. <body> <div class="svet"> <div class="g" id="jg"></div> <div class="y" id="jy"></div> <div class="r" id="jr"></div> </div> <button class="btn" onclick="nextColor()">next</button> </body> .svet{ border:2px solid; position:relative; display:inline-block; background:#D3D3D3; } .g{ border-radius:50px; background:#008000; width: 50px; height:50px; } ...
7 месяцев назад
Шаблон тела продающего сайта на HTML, CSS.
ТЗ - Создайте HTML-страницу и расположите на ней несколько карточек покупок. <body> <div class="cont"> <div class="pik"> <div class="zg"><h3>ENTERPRISE</h3> <hr class="red"></div> <div class="cen"><p>$69<br><span class="grey">per month</span></p></div> <div class="usl"><p>10GB disk space<br> 100GB monthly bandwidth<br> 20 email accounts<br> Unlimited subdomens<br></p> </div> <div class="bottom red"> <p>BUY</p> </div> </div> <div class="pik"> <div class='zg'> <h3>PROFESSIONAL</h3> <hr class="org"></div>...
7 месяцев назад
Создание цветов на HTML, CSS, JS.
ТЗ - Необходимо создать HTML-страницу, на которой будет расположена форма для создания цветов и ниже три примера уже готовых цветов. В форму должно входить два поля ввода (название цвета и код цвета) и одно поле с выпадающим списком. В создаваемых цветах должна отображаться вся информация, введенная в форму. А также необходимо установить валидацию для формы. <body> <div id="formm"> <form> <label for='name'><span>Название цвета:</span><span id="mod1">Поле обязательно</span></label><br> <input type='text'...
7 месяцев назад
Списки в HTML
Почти на каждой странице в интернете используются списки: от товаров на WB до менюшек. Списки бывают 3 типов: нумерованные, маркированные, списки определений Название говорит само за себя. Это те списки, которые пронумерованы от 1 и до бесконечности, хотя если пошаманить с CSS, то нумерацию можно и поменять. Обозначаются тегами "<ol></ol>" для открытия самих списков и тегами "<li></li>" для обозначения элементов. А теперь давайте разберем пример: <!DOCTYPE html> <html> <head> <meta charset="UTF-8">...
8 месяцев назад
Теги в HTML
В HTML тегом называют корневые элементы, в которых находится все содержимое страницы. Обозначается тег определёнными "<тег>" и закрывающий тег выглядит так "</тег>". Теги делятся на 2 типа: парные и одиночные (не имеют закрывающего тега)...
8 месяцев назад
Решил сменить профессию
Наверное, каждый сталкивался с тем, что его что-то не устраивает в настоящем месте работы. Но кто-то справляется со своим выгоранием, а кто-то я. Лично меня не утраивает только заработная плата, поскольку моя изначальная профессия очень низко оплачиваемая. По образованию я актёр театра с зп 30т.р. и из-за этого больших денег никогда в руках не держал. Поэтому основным критерием для нового места работы - оплата труда хотя бы 50т.р.. (Да, не предел мечтаний, но я хочу ставить перед собой достижимые...
8 месяцев назад