Вывод дочерних элементов. Тип 1. CSS
Стили CSS:
.grid_item_style_1 { margin-bottom: 20px; } .grid_item_style_1 a { display: block; position: relative; height: 240px; text-align: center; text-decoration: none; font-family: "Roboto"; font-size: 20px; color:inherit; -webkit-background-size: cover; background-size: cover; background-position: 50%; -webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.14); box-shadow: 0 3px 3px rgba(0, 0, 0, 0.14); border-radius: 4px; } .grid_item_style_1 a span { display: inline-block; width: 100%; position: absolute; bottom: 10px; left:0; padding: 5px 0 7px; background-color: rgba(255, 255, 255, 0.7); -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .grid_item_style_1 a:hover span{ bottom:30px; background-color: rgba(255, 255, 255, 0.95); }
Результат:
Способ поблагодарить автора сайта:
Комментарии (0)
Не писать ответ