У мене є набір <a>
тегів з різними кольорами фону rgba, але той самий альфа. Чи можна написати єдиний стиль css, який змінить лише непрозорість атрибута rgba?
Короткий приклад коду:
<a href="#"><img src="" /><div class="brown">Link 1</div></a>
<a href="#"><img src="" /><div class="green">Link 2</div></a>
І стилі
a {display: block; position: relative}
.brown {position: absolute; bottom: 0; background-color: rgba(118,76,41,.8);}
.green {position: absolute; bottom: 0; background-color: rgba(51,91,11,.8);}
Що я хотів би зробити, це написати єдиний стиль, який змінив би непрозорість, коли <a>
навести курсор, але зберегти колір незмінним.
Щось на зразок
a:hover .green, a:hover .brown {background-color: rgba(inherit,inherit,inherit,1);}
a
елементи на рівні блоку .
a
тег на відміну img
від тексту навколо та іншого навколо тексту. Те, що він підтримується HTML 5, є приємним бонусом.
div
стихії роблятьa
?