Под моим разрешением экрана (оно стандартное)
А что существует 1 стандартное разрешение экрана?
но если разрешение экрана будет большим (FULL HD например)
То есть fullHd - это не стандарт?
Как можно это исправить?
Зависит от ситуации, если нужны общие фразы - использовать media запросы, картинки растягивать на ширину блока и т.д.
Вот например для background вариант:
@media screen and (min-width: 600px) and (min-height: 500px) {
.img {background-image: url(.../02small.jpeg)}
}
@media screen and (min-width: 800px) and (min-height: 600px) {
.img {background-image: url(.../02middle.jpeg)}
}
@media screen and (min-width: 1200px) and (min-height: 700px) {
.img {background-image: url(.../02big.jpeg)}
}
Вот еще вариант:
<img src="image/mushroom.jpg" srcset="image/mushroom_retina.jpg 2x" alt="">
Но тут надо быть аккуратным ибо:
caniuse.com/#search=srcset
Вот в догонку:
<picture>
<source media="(min-width: 800px)" srcset="head.jpg, head-2x.jpg 2x">
<source media="(min-width: 450px)" srcset="head-small.jpg, head-small-2x.jpg 2x">
<img src="head-fb.jpg" srcset="head-fb-2x.jpg 2x" alt="a head carved out of wood">
</picture>