Как я могу визуально указать, какие ссылки являются внешними по отношению к моему сайту?

Question

Можно ли с помощью css визуально указать, какие ссылки указывают на другой сайт?

Answer 1

Если CSS3 является опцией (исключая IE6), вы можете по-разному оформлять внешние ссылки, если ваши строки относительны, а не абсолютны, я имею в виду, что ваши ссылки выглядят так:

<a href="/dir/page.htm">My Page</a>
//and external...
<a href="http://www.google.com">External</a>

Тогда вы можете использовать Селектор атрибутов CSS3 , чтобы по-разному оформлять внешние ссылки, например:

a { color: blue; } /* Internal links */
a[href^=http] { color: red; } /* External Links */

Вы можете увидеть пример этой работы здесь При этом используется атрибут «старт-с», все, что имеет href="http....", будет стилизовано с этим правилом. Единственные альтернативы, которые я вижу, это либо дать вашим внешним (или внутренним, либо одним) ссылкам класс, когда они отображаются, либо сделать то же самое с помощью javascript.

Answer 2

Если вы согласны с тем, что пользователи IE6 исключены, вы можете использовать пункт 4 из здесь . В противном случае я бы пошел с ручным добавлением класса к внешним ссылкам или , используя jQuery (или что-то еще, getElementsByTagName) и проверяя, содержит ли href "http://". Если так, я бы добавил класс к этим элементам Конечно, это будет приемлемо только в том случае, если вы хотите использовать JavaScript.