Скрыть, убрать подобный элемент у изображения

введите сюда описание изображения

Каким образом возможно через css, убрать подобное у изображения при путом src


Ответы (1 шт):

Автор решения: stylok

Если вам нужно "убрать подобное у изображения при пустом src", то всё просто:

[src=""] {
  display:none;
}
<a href="https://i.stack.imgur.com/2Pb9F.png" rel="nofollow noreferrer">
  <img src="" alt="введите сюда описание изображения">
</a>

Однако вместе с этим исчезнет и атрибут alt="описание". Так что, если вам нужно не только скрыть (рыбку съесть), но и вернуть на место описание, то без JS не обойтись. Потребуется сделать как-то так:

// получить все "a > img" с пустым атрибутом [src]
let elements = document.querySelectorAll('a > img[src=""]');
// перебрать их и назначить родителю <a> атрибут 'data-alt'
for (let el of elements) {
  let alt = el.getAttribute('alt');
  let parent = el.closest('a');
  parent.setAttribute('data-alt', alt);
}
/* скрыть пустышки целиком*/
a > img[src=""] {
  display: none;
}
/* воссоздать описание */
a::before {
  content: attr(data-alt);
}
<a href="https://i.stack.imgur.com/2Pb9F.png" rel="nofollow noreferrer">
  <img src="" alt="введите сюда описание изображения">
</a>

→ Ссылка