1

Тема: Як забрати підкреслення картинки в <a href=

Доброго дня!
Допоможіть прибрати підкреслення картинок-посилань при наведення на них на сайті під Wordpress. Тема на якій створено сайт має налаштування вкл/викл підкреслення для посилань. Зараз відкреслення включено. В одному з блоків треба вставити картинки-посилання, але без підкреслення при наведенні на них.  Приклад коду

<p style="text-align: center;">
    <a href="https://wordpress.org/" target="_blank" rel="noopener">
        <img
            src="https://s.w.org/style/images/wporg-logo.svg"
            alt="Blog Tool, Publishing Platform, and CMS — WordPress"
            title="Blog Tool, Publishing Platform, and CMS — WordPress"
            width="240"
        />
    </a>
</p>

Як в CSS правильно описати hover ефект, щоб підкреслення не було. "Text-decoration: none;" - не спрацьовує.

Сайт портфоліо https://logotyp.pp.ua

2

Re: Як забрати підкреслення картинки в <a href=

IS1971 написав:

Доброго дня!
Допоможіть прибрати підкреслення картинок-посилань при наведення на них на сайті під Wordpress. Тема на якій створено сайт має налаштування вкл/викл підкреслення для посилань. Зараз відкреслення включено. В одному з блоків треба вставити картинки-посилання, але без підкреслення при наведенні на них.  Приклад коду

<p style="text-align: center;">
    <a href="https://wordpress.org/" target="_blank" rel="noopener">
        <img
            src="https://s.w.org/style/images/wporg-logo.svg"
            alt="Blog Tool, Publishing Platform, and CMS — WordPress"
            title="Blog Tool, Publishing Platform, and CMS — WordPress"
            width="240"
        />
    </a>
</p>

"
Як в CSS правильно описати hover ефект, щоб підкреслення не було. Text-decoration: none;" - не спрацьовує.

що таке  - "не спарцьовує"? Де у вас видно що саме цей клас або ид застосовується до цього тегу?
Вам треба щось наприклад (файл css треба звичайно підключити, не є повним прикладом):

#site.css

.withoutunderstricke{
text-decoration: none;
}

#some.html
<a class="withoutunderstricke" href="https://wordpress.org/" target="_blank" rel="noopener">
        <img
            src="https://s.w.org/style/images/wporg-logo.svg"
            alt="Blog Tool, Publishing Platform, and CMS — WordPress"
            title="Blog Tool, Publishing Platform, and CMS — WordPress"
            width="240"
        />
    </a>
Робіть що хочете - людина створена вільною
Подякували: leofun011

3

Re: Як забрати підкреслення картинки в <a href=

Ось код
html
--------------
<div class="center">
<div class="wordpress">
<p style="text-align: center;"><a href="https://wordpress.org/" target="_blank" rel="noopener"><img class="img-opacity" src="https://s.w.org/style/images/wporg-logo.svg" alt="Blog Tool, Publishing Platform, and CMS — WordPress" title="Blog Tool, Publishing Platform, and CMS — WordPress" width="240" /></a></p>
</div>
</div>
---------------

css
--------------
.center {
    display: flex;
    justify-content: center;
    overflow: auto;
    max-width: 100%;
   }
.wordpress {
    float: left;
    padding-top: 4%;
    padding-right: 20px;
   }
a:hover {
    text-decoration: none;
   }
.img-opacity {
    opacity: 0.7;
   }
.img-opacity:hover {
    opacity: 1;
   }
---------

Сайт портфоліо https://logotyp.pp.ua

4 Востаннє редагувалося Monolith (01.04.2019 10:36:08)

Re: Як забрати підкреслення картинки в <a href=

Користуйтеся CodePen для демонстрації коду.

a { text-decoration: none; }

Це взагалі прибрати підкреслення.

Скоріше, якесь правило переписує ваше. Почитайте про вагу CSS-селекторів та користуйтеся інспектором в браузері.

Подякували: varkon, leofun012

5

Re: Як забрати підкреслення картинки в <a href=

Monolith написав:

Користуйтеся CodePen для демонстрації коду.

a { text-decoration: none; }

Це взагалі прибрати підкреслення.

Скоріше, якесь правило переписує ваше. Почитайте про вагу CSS-селекторів та користуйтеся інспектором в браузері.

Так я і хочу прибрати повністю на одних картинках сайту. В загальному налаштуванні теми вибрано "показувати підкреслення на посиланнях". А от тільки на цих картинках-посиланнях хочу прибрати підкреслення.

Сайт портфоліо https://logotyp.pp.ua

6

Re: Як забрати підкреслення картинки в <a href=

IS1971 написав:
Monolith написав:

Користуйтеся CodePen для демонстрації коду.

a { text-decoration: none; }

Це взагалі прибрати підкреслення.

Скоріше, якесь правило переписує ваше. Почитайте про вагу CSS-селекторів та користуйтеся інспектором в браузері.

Так я і хочу прибрати повністю на одних картинках сайту. В загальному налаштуванні теми вибрано "показувати підкреслення на посиланнях". А от тільки на цих картинках-посиланнях хочу прибрати підкреслення.

створіть свій клас як я показав. Й вньому робіть що вам забажається.

Робіть що хочете - людина створена вільною

7

Re: Як забрати підкреслення картинки в <a href=

varkon написав:
IS1971 написав:
Monolith написав:

Користуйтеся CodePen для демонстрації коду.

a { text-decoration: none; }

Це взагалі прибрати підкреслення.

Скоріше, якесь правило переписує ваше. Почитайте про вагу CSS-селекторів та користуйтеся інспектором в браузері.

Так я і хочу прибрати повністю на одних картинках сайту. В загальному налаштуванні теми вибрано "показувати підкреслення на посиланнях". А от тільки на цих картинках-посиланнях хочу прибрати підкреслення.

створіть свій клас як я показав. Й вньому робіть що вам забажається.

Створив. Результат той же.

Сайт портфоліо https://logotyp.pp.ua

8

Re: Як забрати підкреслення картинки в <a href=

IS1971 написав:

Створив. Результат той же.

ваше правило приміняеться? що ви бачете в інспекторі?

Робіть що хочете - людина створена вільною

9 Востаннє редагувалося IS1971 (01.04.2019 11:55:48)

Re: Як забрати підкреслення картинки в <a href=

https://replace.org.ua/uploads/images/7808/cdec397c31f50cbfaa67fdbb98fa5d04.jpg
Скрін

Сайт портфоліо https://logotyp.pp.ua