Фильтр по:
  

  • Страница 1 из 1
  • 1
Модератор форума: likbezz  
Скрипты и коды для юкоз - Форум аццкого кодера » Как сделать? Информация для вновь прибывших » Как сделать... » Стилизация внешних ссылок средствами CSS. Кроссбраузерно (Кроссбраузерный пример оформления внешних ссылок стилями CSS)
Стилизация внешних ссылок средствами CSS. Кроссбраузерно
Дата: Понедельник, 25.07.2011, 11:25 |
likbezz
Аццкий кодер
Группа: Администраторы
Сообщений: 9093
Награды: 23
Репутация: 459
Статус: Unknown


По мотивам одноимённой статьи «Стилизация (оформление) внешних ссылок. Для юКоз (uCoz)» ...

Доработанная версия.
Для форума:

Стили для нормальных браузеров:
Quote (CSS)
<style type="text/css">
/*Start(Для нормальных браузеров)*/
a.ext,
td.posttdMessage a[href^="http"]:not([href*="likbezz."]),
td.posttdMessage a[href^="/go?"]{padding-right:15px;background:transparent url('/_theme1/_st/ico/_ext1.gif') no-repeat right 2px;}
/*End(Для нормальных браузеров)*/
</style>


Стили для ИЕ v6, v7 (лучше вынести в отдельную таблицу стилей):
Типа:
Quote (HTML)
<!--[if lte IE 8]><link rel="stylesheet" type="text/css" href="/_st/css/_msie6and7.css" /><![endif]-->


Стили:
Quote (CSS)
<style type="text/css">
/*Start(Для ИЕv6,v7)*/
*+html td.posttdMessage a{z-index:expression(runtimeStyle.zIndex=1,this.href?((this.href.lastIndexOf("likbezz.")==-1&&this.href.lastIndexOf("javascript:")==-1)||this.href.lastIndexOf("/go?")>-1)?className+=" ext":false:false);}/*For IEv7*/
* html td.posttdMessage a{z-index:expression(runtimeStyle.zIndex=1,this.href?((this.href.lastIndexOf("likbezz.")==-1&&this.href.lastIndexOf("javascript:")==-1)||this.href.lastIndexOf("/go?")>-1)?className+=" ext":false:false);}/*For IEv6*/
a.ext{padding-right:15px;background:transparent url('/_theme1/_st/ico/_ext1.gif') no-repeat right 2px;}
/*End(Для ИЕv6,v7)*/
</style>


Ну и, конечно, пример ... )

Смотреть ....

Скриншотики ...

Под ИЕ v7 и v6 ....





Safari, Хром:





Мозилла: ヅ


...

Код примера, на всякий ....

...

Прикрепления: 6662758.png (7.6 Kb) · 5478149.png (8.4 Kb) · 3497078.png (8.4 Kb) · 3991643.png (9.2 Kb) · 6031015.png (7.3 Kb)

 
Дата: Пятница, 09.03.2012, 12:46 |
Сергей
Рядовой
Группа: Зарегистрированные
Сообщений: 7
Награды: 0
Репутация: 0
Статус: Offline


likbezz,
Можно сделать так, чтобы соответствующие значки появлялись возле внутренних ссылок на файлы doc, xls, pdf и т.д.?


 
Дата: Пятница, 09.03.2012, 14:30 |
likbezz
Аццкий кодер
Группа: Администраторы
Сообщений: 9093
Награды: 23
Репутация: 459
Статус: Unknown


Сергей,
Quote (Сергей)
Можно сделать так, чтобы соответствующие значки появлялись возле внутренних ссылок на файлы doc, xls, pdf и т.д.?

Можно)
Code
a[href$='.pdf']{padding-right:15px;background:transparent url('/_theme1/_st/ico/_pdf.gif') no-repeat right 2px;}

и так далее ...

IE не поддерживает подобные конструкции ...
...


 
Скрипты и коды для юкоз - Форум аццкого кодера » Как сделать? Информация для вновь прибывших » Как сделать... » Стилизация внешних ссылок средствами CSS. Кроссбраузерно (Кроссбраузерный пример оформления внешних ссылок стилями CSS)
  • Страница 1 из 1
  • 1
Поиск:


Мобильная версия