Как делать фон правильно?

Рейтинг: 1Ответов: 2Опубликовано: 05.12.2014

Я только-только учусь верстать, это моя первая попытка.

Как лучше всего оформлять фон?

Сейчас у меня всё выглядит так:

alt text

#header_top 
{
    font-family: "open Sans", "Open Sans Light", sans-serif;
    font-size: 14px;
    background-image:url(img/header_top.png);
    background-repeat:no-repeat;
    margin:0px; 
}

#header_top div{
    display: inline-block;
    margin-right:50px;
    margin-left:50px;
}

#header_bottom
{
    background-image:url(img/header_bottom.png);
    background-repeat:no-repeat;

}

Как сделать, чтобы фон headerа был по всей ширине окна браузера и при изменении размеров окна растягивался соответствующе?

css html вёрстка
Источник: Stack Overflow на русском

Ответы

▲ 1

Фон, как у вас, нельзя растянуть, т.к. в нем отсутствуют повторяющиеся элементы и он выполнен картинкой. Можно использовать картинку гораздо большего размера (например шириной 1440px) и обрезать или подгонять по ширине ее на меньших экранах. Можно выбрать картинку с одинаковыми левым и правым краями и заставлять ей все пространство header.

▲ 1

Если фоновая картинка маленькая, попробуйте подогнать ее с помощью background-size