Эффект при нажатии кнопки мышки | mouse click effect | Animation css | html
Эффект волны при нажатии на кнопку. Как это сделать?
Данный эффект далеко не новый, все мы его знаем по Material Design. В этой статье я покажу свою версию этого эффекта для сайта на примере обычной кнопки. Стоит помнить, что данный эффект может быть применён не только к кнопке, но и к любому другому блоку. Создаём кнопку Для начала я накидал дизайн нашей будущей кнопки: Для начала надо просто добавить кнопку на сайт. Для этого я написал следующий код: HTML: И, конечно же, CSS: Стоит обратить внимание на стили элемента wave_elem, а именно на position и overflow...
Псевдоклассы CSS
Псевдоклассы CSS позволяют изменять динамическое состояние элемента веб страницы. В качестве динамического состояния может выступать нажатие на элемент, наведение курсора и тп. Внешний вид элементов изменяется с помощью селекторов. Но что если вам необходимо в таблице изменить все четные строки. То есть добавить цветную заливку или изменить в них цвет текста. Можно прописать класс для каждой четной строки вручную, но это займет время и увеличит размер страницы. Простым решением будет использовать псевдокласс :nth-child(even) для селектора tr...