Заменить src тега изображения, используя свойство css

Есть ли способ, с помощью которого я могу заменить изображение, указанное в атрибуте SRC вкладки изображения, используя любой трюк css?Заменить src тега изображения, используя свойство css

<img src = "setting-icon.png"></img>

я хочу, чтобы заменить настройки-icon.png с CSS собственностью, я могу поставить другое изображение в фоновом режиме с фоновым изображением свойством тега изображений, но мне нужно, чтобы прятались один упомянутые в ГКЗЕ и шоу что я упоминаю в свойстве background-image в css.

Да, это странное требование, но дело в том, что я выполняю настройку в стороннем приложении, где у меня есть только контроль над css, я не могу изменять теги HTML.

спасибо, что прочитали!

источник

2017-02-23 Mayur Randive

Вы можете использовать content:url("image.jpg")

https://developer.mozilla.org/en-US/docs/Web/CSS/content

В вашем CSS,

.img { 
    content:url("/new/image/source.png"); 
}

Если вы не можете изменить HTML,

img { 
    content:url("/new/image/source.png"); 
}

В HTML

<img class="img"/>

Я еще не пробовал, но я не уверен, что встроенный атрибут src будет иметь избыточный вес CSS content.

Update

Он должен работать, если у вас уже есть для вашего исходным текстам IMG элемента. Спасибо @pol

источник

2017-02-23 03:46:47

Он не может изменить HTML, поэтому я предполагаю, что он не может добавить «класс» на изображении. –

изменить на селектор элементов, а затем –

Он работал, содержимое url перезаписывает src img tag –

Вы не можете изменить значения атрибутов html с помощью CSS, только javascript.

Но с помощью CSS вы можете «скрыть» изображение и поместить фон на свое место.

div img { 
 
    height: 0; 
 
    width: 0; 
 
    padding-top: 175px; 
 
    padding-left: 280px; 
 
    background-image: url("http://www.planwallpaper.com/static/cache/6f/82/6f8200c95d588fde83d1f212f674611a.jpg"); 
 
}

<img src="http://www.planwallpaper.com/static/cache/a1/4e/a14e880ef245c3d159ba96ebbeb4c8c3.jpg"> 
 

 
<div>Changed img:</div> 
 
<div><img src="http://www.planwallpaper.com/static/cache/a1/4e/a14e880ef245c3d159ba96ebbeb4c8c3.jpg"></div>

источник

2017-02-23 03:54:43 pol

попробует это и сообщит вам когда-нибудь, спасибо pol за ваше время! –

@MayurRandive вы можете использовать jQuery/Javascript? –

@ Дипак Ядав: Нет –

Хороший вопрос, чтобы узнать о незаметных селекторов с использованием CSS,

Кроме того, Вы можете прочитать больше о других селекторов,

Например:

img: hover {}

и некоторые другие приятные селекторы для различного диапазона элементов

:active 

:after 

:before 

:first-child 

:first-letter 

:first-line 

:focus 

:hover 

:lang 

:link 

:visited

Можно даже условно выбрать так:

img[src="setting-icon.png"] { 
    border: 1px solid #000000; 
    content:url("/new/image/source.png"); 
}

Reference: W3.org - Advanced Selectors

источник

2017-02-23 04:34:56 wpcoder

Заменить src тега изображения, используя свойство css

ответ

Смежные вопросы