Прозорий ефект наведення CSS для цього є непрозорість:1; . Коли вказівник миші відійде від зображення, зображення знову стане прозорим.
Як зробити прозору кнопку (анімована під час наведення миші)
- Крок 1. Відредагуйте веб-частину ShortPoint.
- Крок 2. Відкрийте налаштування елемента дизайну кнопки.
- Крок 3: Скопіюйте та вставте спеціальний CSS.
- Крок 4: (необов’язково) оновіть колір тексту елемента дизайну кнопки.
- Крок 5: Застосуйте зміни та збережіть зміни.
Як видалити ефект наведення в CSS за допомогою подій покажчика. Властивість pointer-events у CSS дозволяє контролювати, за яких обставин (якщо такі є) певний графічний елемент може стати ціллю подій миші. Встановивши для властивості pointer-events елемента значення none, ви можете видалити ефект наведення.
Щоб змінити колір фону під час наведення курсора за допомогою CSS, ви можете використовуйте селектор псевдокласу :hover. У цьому прикладі колір фону елемента буде змінено з #0001 на #000F під час наведення курсора. Для отримання додаткової інформації про псевдо-класи та ефекти наведення ви можете прочитати тут.
Значення від 0 до 1: використовується для встановлення непрозорості десяткових значень заповнення. Значення 0 означає, що заливка повністю прозора і невидима. Значення 1 означає, що заливка повністю непрозора та видима.
Щоб створити прозору кнопку за допомогою HTML і CSS, ви можете встановіть для властивості background-color значення rgba з альфа-каналом менше 1 (наприклад, rgba(0, 0, 0, 0,5) для напівпрозорого чорного). Це дозволяє базовому вмісту відображатися через кнопку, створюючи ефект прозорості.