CSS hover 2 других элемента (и другие атрибуты)

У меня есть ссылка <a></a> и внутри этой ссылки у меня есть холст и обычный текст. Оба элемента имеют прозрачность (по сравнению с rgba()) с видимостью 50%. С зависанием этой ссылки я бы хотел изменить свойство видимости на 100% на оба элемента.CSS hover 2 других элемента (и другие атрибуты)

Проблема заключается в следующем: in canvas Мне нужно изменить цвет фона. С этим текстом внутри ссылки мне нужно изменить цвет. ссылка выглядит следующим образом:

<a href="" class="table_link"> 
    <canvas class="canvas_table_item"></canvas> 
    Chair 
</a>

если я ставлю как в 1 селекторе:

.content_table *:hover{ 
    color:rgba(255, 255, 255, 1); 
    background-color:rgba(255, 255, 255, 1); 
}

это изменить цвет фона текста (ссылка), а .. мне нужно изменить цвет фона ТОЛЬКО на холсте и цвет текста (его можно также изменить на холсте). Есть ли способ, как добиться этого только с помощью CSS или действительно ли мне нужно использовать javascript?

ОТВЕТ ЗДЕСЬ: DEMO
РЕШЕНИЕ ЯВЛЯЕТСЯ ADD И ВНУТРИ ЭТО Текст ссылки КАК ЗДЕСЬ:

<a href="" class="table_link"> 
    <canvas class="canvas_table_item"></canvas> 
    <span> 
    Chair 
    </span> 
</a>

источник

2013-07-07 piggy

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

это не решение. потому что если вы наведете только текст, я не смогу получить этот фон на холсте. И об этом я и спрашиваю. Если есть способ, как выбрать цвет фона холста. что-то вроде canvas_table_item.background-color: ..... но я думаю, что смогу сделать это только с javascript – piggy

Это то, что вы хотите? DEMO

Просто добавьте эти правила CSS:

a.table_link { 
    display: inline-block; 
    border: 1px solid black; 
} 
a:hover > canvas { 
    background-color:rgba(255, 255, 255, 1); 
} 

a:hover > * { color:rgba(255, 255, 255, 1); }

источник

2013-07-07 20:18:25 leoMestizo

, что именно то, что мне нужно, и что у меня было .. мне интересно, почему в моем коде он не работает. .Ok, неважно. Благодарим за ответ, отмечаем как ответ и отправляемся на поиски проблемы на моей стороне. Спасибо – piggy

Рад помочь вам! =) – leoMestizo

AH! было решением! ему нужно добавить вокруг текста внутри ссылки .. – piggy

Вот еще question, что есть ответ.

Попробуйте это:

*:hover .content_table{ color:rgba(255, 255, 255, 1); background-color:rgba(255, 255, 255, 1); }

источник

2013-07-07 20:18:26

Вы можете выполнить это с помощью CSS, javascript на самом деле не нужен –

CSS hover 2 других элемента (и другие атрибуты)

ответ

Смежные вопросы