Как сделать подсветку в css

Сделать подсветку (highlight) в CSS можно с помощью свойства box-shadow. Это свойство позволяет добавлять тень вокруг элемента, которая может использоваться для создания эффекта подсветки.

Вот пример CSS-кода для создания подсветки для кнопки:

.button {
  background-color: #007bff;
  color: white;
  padding: 10px;
  border-radius: 5px;
  box-shadow: 0px 0px 10px #007bff;
}

.button:hover {
  box-shadow: 0px 0px 20px #007bff;
}

Здесь мы задали стиль для кнопки, используя свойства background-color, color, padding, border-radius. Затем мы добавили свойство box-shadow, чтобы создать эффект подсветки вокруг кнопки. Это свойство имеет три параметра:

• x-offset — горизонтальное смещение тени от элемента (0 в нашем случае).
• y-offset — вертикальное смещение тени от элемента (0 в нашем случае).
• blur-radius — радиус размытия тени (10px в нашем случае).

При наведении на кнопку мы меняем параметр blur-radius с 10px до 20px, чтобы увеличить радиус размытия тени и создать эффект увеличенной подсветки.

.button:hover {
  box-shadow: 0px 0px 20px #007bff;
}

Также можно использовать свойство text-shadow для создания подсветки текста. Вот пример CSS-кода для создания такой подсветки:

.text {
  color: #333;
  text-shadow: 1px 1px #ccc;
}

Здесь мы добавили свойство text-shadow, которое имеет два параметра:

• x-offset — горизонтальное смещение тени от текста (1px в нашем случае).
• y-offset — вертикальное смещение тени от текста (1px в нашем случае).
• color — цвет подсветки (#ccc в нашем случае).

Таким образом, мы создали эффект затемнения текста, который может быть использован для создания более выразительных заголовков или подзаголовков страницы.