197 читали · 1 год назад
Делаем всплывающее сообщение при наведении в CSS
Добрый день. Сейчас рассмотрим такую задачку, когда необходимо посредством CSS добавить всплывающую подсказку на наш сайт. Допустим у нас имеется кнопка такого типа: <button class="btn">Кнопка</button> И нам нужно, чтобы при наведении на эту кнопку появлялась небольшая табличка с описанием такого типа: <span class="btndescription">Описание</span> Итак, приступим. Для начала создаем отдельный блок div для кнопки: <div id="btnblock"> </div> Внутри этого блока вставляем нашу кнопку и описание: <div...
3 года назад
Тег "Input" в HTML и CSS
Тег input используется для создания строк для ввода. То есть, все вы видели поисковые строки в яндекс поисковике, google, youtube и так далее. Все они создаются тегом input. В браузере на нашем сайте появилось поле, с которым можно воспользоваться обычному пользователю (что-то написать). Но это выглядит не совсем интересно или красиво. Мы попробуем сверстать поисковую строку как в Яндексе и Google. Поисковая строка Яндекс Выглядит он примерно так: Для создания поисковой строки "Яндекс" я положил тег input и текст h3 в контейнер с уникальным именем search...
Всплывающие подсказки на 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{...