Как задать свойство css для конкретного значения

@Desent · Регистрация: 07.06.2014

Author24 — интернет-сервис помощи студентам

Извиняюсь за непонятную формулировку вопроса, не знаю как это сказать по другому. Сейчас всё объясню. Например, у меня есть такой код css:

CSS

a {
color: black;
text-decoration: none;
border: 2px solid blue;
}
 
a:hover {
opacity: 0;
transition: 1s;
}

Если использовать такой код, то при наведении прозрачным станет не только текст, но и рамка (border), но мне нужно, чтоб прозрачным становилась только ссылка, а рамка оставалась такой, как и была. Можно ли это реализовать в css, и реализовать так, чтоб не пришлось добавлять для рамки отдельный див, и если да, то как? Надеюсь объяснил понятно. Надеюсь вы не будете у меня задавать вопросов типа "зачем тебе это?".

@Qwertiy · 18.07.2014, 18:22

CSS

a {
    color: black;
    text-decoration: none;
    border: 2px solid blue;
}
 
a:hover {
    color: rgba(0, 0, 0, 0);
    transition: 1s;
}

http://jsfiddle.net/BfyKL/

@Desent · 18.07.2014, 18:34 **[ТС]**

Qwertiy, спасибо конечно, в этом случае такой способ подойдёт, но бывают случаи когда вместо текста прозрачным нужно сделать не текст, а картинку. На сколько я знаю с картинкой такое не прокатит. Вот пример:

HTML5

1
2
3

<body>
<a href="index.html"><img src="images/picture.png"></a>
</body>

CSS

img {
    border: 2px solid black;
}
 
img:hover {
    opacity: 0;
    transition: 1s;
}

Добавлено через 5 минут
Вот еще:

CSS

img {
    border: 2px solid black;
    opacity: 0.5;
}

Прозрачным станет не только изображение, но и рамка. Рамку, как я и сказал прозрачной делать не нужно.

@Qwertiy · 18.07.2014, 18:37

Для картинок можно использовать a img и a:hover img.

@Qwertiy 834 / 642 / 101 Регистрация: 20.08.2013 Сообщений: 2,524
	18.07.2014, 18:37	4
	Сообщение было отмечено Desent как решение Решение Для картинок можно использовать a img и a:hover img. 1

Как задать свойство css для конкретного значения

Решение