Интернет |
Фоновая картинка
Перепробовал много вариантов, но ни как не могу найти правильное решение.
В первом варианте всё работает, картинка сжимается при изменении размера окна браузера
1.
<!DOCTYPE html>
<head><style>
.block{width:100%;height:auto;background: no-repeat;margin:0;padding:10px;}
</style></head><body>
<header></header><page>
<p></p>
<div class="block"><img src="../img.jpg"></div>
<p></p>
</page><footer></footer></body></html>
Во втором варианте фоновая картина остаётся в заданных размерах
2.
<!DOCTYPE html>
<head><style>
.block{width:100%;max-width:800px;height:462px;background:url("../img.jpg")
</style></head><body>
<header></header><page>
<h1></h1>
<p></p>
<div class="block"></div>
<p></p>
</page><footer></footer></body></html>
нужно чтоб второй вариант работал как в первом т.е. картинка сжималась при изменении размера окна браузера.
Подскажите где что не так.
В первом варианте всё работает, картинка сжимается при изменении размера окна браузера
1.
<!DOCTYPE html>
<head><style>
.block{width:100%;height:auto;background: no-repeat;margin:0;padding:10px;}
</style></head><body>
<header></header><page>
<p></p>
<div class="block"><img src="../img.jpg"></div>
<p></p>
</page><footer></footer></body></html>
Во втором варианте фоновая картина остаётся в заданных размерах
2.
<!DOCTYPE html>
<head><style>
.block{width:100%;max-width:800px;height:462px;background:url("../img.jpg")
</style></head><body>
<header></header><page>
<h1></h1>
<p></p>
<div class="block"></div>
<p></p>
</page><footer></footer></body></html>
нужно чтоб второй вариант работал как в первом т.е. картинка сжималась при изменении размера окна браузера.
Подскажите где что не так.