XHTML 1.0 Строгий, CSS и IMG границы

Я использую XHTML 1.0 Strict на своем веб-сайте и у меня есть следующий стиль CSS на моих ссылках:

a:hover {
    border-bottom: 1px dotted #447799;
}

и мои изображения:

a img, img {
    border: none;
    text-decoration: none;
}

Тем не менее, когда я наведите курсор на заголовок своего заголовка, нижняя граница все еще будет выделена пунктиром и синим цветом. Очевидно, я не могу использовать border="0", потому что он не является частью XHTML 1.0 Strict Doctype.

Вы можете увидеть мой сайт здесь: http://armorycraft.com/

Предложения?

5 ответов

Решение

Вы можете использовать класс:

a.imageAnchor:hover {
    border:none;
}

Не самое красивое решение, но оно должно работать.

a:hover имеет рамку:1, поэтому автоматически a:hover img У als есть граница: 1

Я думаю это исправит

a:hover img{border:0;}

теперь вам не нужно создавать новый класс для него

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

a img:hover, img:hover {border:none; text-decoration:none;}

Это сработало для меня: (Я думаю, вы просто забыли двоеточие (:)

a:img, img {
    border: none;
    text-decoration: none;
}

Удачи!

Проблема в том, что рамка привязана к якору, но затем вы устанавливаете границу: нет изображения.

Нет простого способа избежать этого. Я бы посоветовал немного подправить эту штуку:

a:hover {
    border-bottom: 1px dotted #447799;
}

a.image:hover {
    border: none;
}

Итак, добавьте класс "image" ко всем якорям с изображениями, и все готово.

Другие вопросы по тегам