Как изменить цвет div, наведя курсор мыши

Автор: Joan Hall
Дата создания: 25 Январь 2021
Дата обновления: 19 Май 2024
Anonim
Уроки HTML, CSS / Эффекты при наведении мышки – например меняется картинка - css hover
Видео: Уроки HTML, CSS / Эффекты при наведении мышки – например меняется картинка - css hover

Содержание

Теги DIV (аббревиатура «split») определяют раздел документа HTML и часто используются с языком CSS для создания основного макета сайта. DIV можно настроить с помощью CSS, чтобы определить поля, интервалы, границы, размер текста, выравнивание или цвет фона, а также более сложные приемы, такие как изменение цвета DIV при наведении на него курсора.


направления

Язык CSS позволяет применять приемы для улучшения взаимодействия пользователя со страницей. (Comstock / Comstock / Getty Images)
  1. Откройте документ со своей веб-страницы в текстовом редакторе.

  2. Поместите курсор на пустую строку между«И»'.

  3. Введите "type = 'text / css'>" и нажмите "Enter". После этого вы начнете создавать скрипт CSS.

  4. Введите «# div1: hover {background-color: # ff0000;}» и нажмите «Ввод». Это позволит настроить контейнер DIV со значением «div1» в качестве свойства идентификатора, используя цвет фона «# ff0000» (шестнадцатеричное значение) при активированном состоянии «зависания», что произойдет, когда курсор мыши будет расположен над DIV. Эти значения идентификатора и цвета фона могут быть изменены при необходимости.


  5. Тип "msgstr "закрыть тег скрипта CSS.

  6. Поместите текстовый курсор на пустую строку между тегами "" и "".

  7. Введите «» и нажмите «Enter», чтобы создать контейнер DIV со значением идентификатора «div1». Если вы изменили имя идентификатора на шаге 4, вы должны указать это имя здесь.

  8. Введите или вставьте содержимое для включения в DIV и нажмите «Ввод».

  9. Введите "", чтобы закрыть контейнер DIV.

  10. Нажмите «Файл» и «Сохранить», чтобы сохранить документ.