X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Оформление внешних ссылок при помощи CSS, Каким образом можно оформить стилями внешние ссылки сайта
komarik_vlad
komarik_vlad
Topic Starter сообщение 23.10.2017, 21:08; Ответить: komarik_vlad
Сообщение #1


Подскажите, как можно оформить внешнюю ссылку на сайте при помощи CSS, на подобие, как оформлены в википедии. Я делал попытки, установил в CSS файл вот такой код:

Код
a.newlinks[href^="http://"]:not([href*="1st-finstep.ru"]):after,
a.newlinks[href^="https://"]:not([href*="1st-finstep.ru"]):after,
a.newlinks[href^="ftp://"]:not([href*="1st-finstep.ru"]):after {
    content: "" url('/icon/external.png');
    padding-left:5px;}

, где
newlinks - это просто класс стилей для ссылок. Так вот, в старой опере все работает хорошо, а в новых браузерах (chrome, yandex) не работает. Почему?


--------------------
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
x64
x64
сообщение 24.10.2017, 10:15; Ответить: x64
Сообщение #2


Всё рабочее. Даже тут показывается, при ссылке на официальную страницу, и в ff, и в хроме, и даже в ослике.
Если не кажет после добавления, очевидно (на 99%), что в кеше сидит старый css.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
mmkulikov
mmkulikov
сообщение 24.10.2017, 13:11; Ответить: mmkulikov
Сообщение #3


Цитата(komarik_vlad @ 23.10.2017, 19:08) *
а в новых браузерах (chrome, yandex) не работает. Почему?

Цитата(komarik_vlad @ 23.10.2017, 19:08) *
content: "" url('/icon/external.png');

Вот это мне как-то не нравится...
Может стоит только url оставить. Ну и убедитесь в правильности пути к картинке
Ещё я бы в инспекторе просмотрел размеры псевдоэлемнта. Может в "новых" браузерах они вышли нулевыми.


--------------------
Сдается, обращаться скайп avdesk-it-kmm
VPS от 5€
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
x64
x64
сообщение 24.10.2017, 13:21; Ответить: x64
Сообщение #4


Цитата(mmkulikov @ 24.10.2017, 12:11) *
Вот это мне как-то не нравится...

Тогда до кучи и перед after двоеточие поставить нужно)
Но суть в том, что браузеры это нормально переваривают. За мобильные не знаю, но настольные додумывают правильно.

Цитата(mmkulikov @ 24.10.2017, 12:11) *
Ещё я бы в инспекторе просмотрел размеры псевдоэлемнта

Всё работает. Ссылочку выше оставил.
Проблема, скорее всего, в том, что в кэше сидит старая версия стилей.


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
komarik_vlad
komarik_vlad
Topic Starter сообщение 24.10.2017, 18:41; Ответить: komarik_vlad
Сообщение #5


Цитата(x64 @ 24.10.2017, 13:21) *
Тогда до кучи и перед after двоеточие поставить нужно)

Вообще-то в коде перед after стоит двоеточие, а же в начале указал кусок кода своего CSS.
Цитата(mmkulikov @ 24.10.2017, 13:11) *
Может стоит только url оставить. Ну и убедитесь в правильности пути к картинке

Путь верный к картинке, на старой опере же работает отлично.

Кстати, а как обновить этот файл в кэше, я обновлял страницу, а эффекта ноль. Вот только что опять попробовал, а стили не работаю в Хроме?


Все, всем спасибо, все получилось. Нажал CTRL+F5 в хроме и все обновилось. Кстати, а почему просто через обновление странице это не работало? :)


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
x64
x64
сообщение 24.10.2017, 18:59; Ответить: x64
Сообщение #6


Цитата(komarik_vlad @ 24.10.2017, 17:41) *
Вообще-то в коде перед after стоит двоеточие

Вообще-то их там два должно быть по феншую)
Но этот синтаксис новее, и для совместимости в браузерах поддерживается одно двоеточие. В общем, так правильно, но всем пофигу, работает же.

Цитата(komarik_vlad @ 24.10.2017, 17:41) *
Нажал CTRL+F5 в хроме и все обновилось

Мистика :D
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
komarik_vlad
komarik_vlad
Topic Starter сообщение 24.10.2017, 23:38; Ответить: komarik_vlad
Сообщение #7


А теперь еще вопросик из этой темы. Этот код вешает значок стрелки на все внешние ссылки, в том числе и на картинку RSS, а это не комельфо. Как исправить?


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
x64
x64
сообщение 25.10.2017, 9:30; Ответить: x64
Сообщение #8


Цитата(komarik_vlad @ 24.10.2017, 22:38) *
Этот код вешает значок стрелки на все внешние ссылки, в том числе и на картинку RSS

Вы сначала определили класс newlinks для ссылок, но в стилях прописали a[href...
Вот оно ко всем и применяется. Сделайте как в первом сообщении:
a.newlinks[href…

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
2 чел. читают эту тему (гостей: 2, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Горячая тема (нет новых ответов) Тема имеет прикрепленные файлыБыстрая индексация страниц сайта и обратных ссылок - 2Index
39 2Index 6720 22.4.2024, 16:16
автор: 2Index
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыGogetTop.net - сервис аренды ссылок с сети PBN адалт тьюбо
1 Crimean 1442 11.4.2024, 10:05
автор: Crimean
Горячая тема (нет новых ответов) Тема имеет прикрепленные файлыРучное размещение вечных ссылок и статей на хороших площадках
Опыт 10 лет!
420 leonidukg 274747 8.4.2024, 12:06
автор: leonidukg
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыКрауд-маркетинг. Ручное размещение ссылок под бурж с гарантией
24 seolink.orders 12923 2.4.2024, 17:23
автор: seolink.orders
Открытая тема (нет новых ответов) Мегамаркет. Скидка 1000 рублей при покупке от 5000 рублей на все, на первый заказ.
Мегамаркет. Скидка 1000 рублей при покупке от 5000 рублей на все, на п
7 stu999 1756 31.3.2024, 11:19
автор: stu999


 



RSS Текстовая версия Сейчас: 24.4.2024, 1:11
Дизайн