Можно ли изменить внешний вид html-ссылки при отключении? Например, используя что-то вроде:
a.disabled
{
color:#050;
}
<a class="disabled" disabled="disabled" href="#">Testing</a>
Приведенный выше пример не работает с IE, но работает для Firefox, в IE он остается серым, даже когда я устанавливаю цвет в стиле. Если я удаляю disabled="disabled", то он работает.
Класс :disabled pseduo работает только с полями ввода, такими как текст, радио, флажок и т.д. и применяется, когда вы даете элементу атрибут `disabled = "disabled". Однако IE6 не распознает псевдокласс, поэтому вам нужно будет использовать класс отдельно, чтобы заставить его работать.
<input type="text" value="You can't type here" disabled="disabled" class="disabled" />
можно создать с помощью
input[disabled="disabled"], input.disabled {
/* whatever you want */
}
Псевдокласс применим к современным браузерам, в то время как класс будет охватывать IE6.
Как сказал Радексоник, если вы хотите, чтобы отключенный CSS отображался на других элементах, например якорях, вам просто нужно было создать и использовать класс. Нет атрибута disabled для <a> s
Для ссылки, подобной той, которую вы указали в комментарии:
<a href="#" disabled="disabled">some link</a>
Стиль будет (как и любой другой селектор, основанный на атрибуте):
a[disabled=disabled] {
color: red;
font-weight: bold;
}
Если бы я был на вашем месте, я бы проверял поведение в кросс-браузере. Я раньше не видел атрибут disabled.
Использование
a.disabled
{
color: #CCC;/* Just an example */
}
Просто используйте точку, за которой следует имя класса, чтобы указать, что вы хотите использовать этот класс.
Он работает во всех браузерах
Конечно, просто добавление класса для стилей ваших элементов <a> определенным образом не остановит их на самом деле, выполняя их нормальное действие. Для этого вам понадобится javascript. В основном вы могли бы:
<a href="foo.htm" class="disabled" onclick="return false;">linky</a>
Вы можете использовать селектор атрибутов для полной поддержки браузера.
Этого будет достаточно:
a[disabled] {
display:none;
}
ВЫБОРЫ ATTRIBUTE
[att]
Сопоставьте, когда элемент устанавливает атрибут att, независимо от значения атрибута.
[att=val]
Сопоставьте, когда значение атрибута атрибута "att" будет точно "val" .
[att~=val]
Представляет элемент с атрибутом att, значение которого представляет собой список слов, разделенных пробелами, один из которых является точно "val" . Если "val" содержит пробел, он никогда не будет представлять ничего (поскольку слова разделены пробелами). Если "val" - это пустая строка, она никогда не представит ничего.
[att|=val]
Представляет элемент с атрибутом att, его значение либо является точно "val" , либо начинается с "val" , а затем "-" (U + 002D). Это в первую очередь предназначено, чтобы разрешить совпадение языкового подкода (например, атрибут hreflang для элемента a в HTML), как описано в BCP 47 ([BCP47]) или его преемника. Для сопоставления субкода языка lang (или xml: lang) см. Псевдоязык: lang.
< a class= "disabled" > Моя отключенная ссылка </a>
a.disabled {
display:none;
}
Есть только 5 (я думаю) псевдосектор селекторов для ссылок: ссылка, посещение, зависание и активность, а также фокус.
если вы используете JQUERY, вы можете добавить атрибут anchor
.attr("disabled","true")
и удалите его
.removeAttr("disabled")