How to change the <img> tag so that I can select an image in CSS?

I have an image with hard code, but I want to change it for different themes. How can i do this? I tried to create a range and set its background-image property, but it did not work ...

I do not want to hardcode the width / height, as the image I am changing may be a different size.

+3
source share
4 answers

I don’t think you can use pure CSS unless you specify width and height. So just set the width and height in CSS along with your image as a background image and your image. You know what image you use in the theme so that you know its size.

/* Theme1.css */
.ThemeImage
{
    background-image: url('imageTheme1.jpg');
    width: 150px;
    height: 100px;
}

/* Theme2.css */
.ThemeImage
{
    background-image: url('imageTheme2.jpg');
    width: 300px;
    height: 50px;
}

and etc.

+2

-, , -, . , .

CSS img src .

+1

, . , .

, , 0x0. , " " , .

CSS , , HTML, "block". (, span) , . , .

, , , display: inline-block;, IE , .

+1

<img> ? css.

<img src='transparent.gif' alt='image' id='change' />

img#change { background: url(pic1.jpg); width:200px; height:200px; }

, ...

0

Source: https://habr.com/ru/post/1719085/


All Articles