1

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

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

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

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а был по всей ширине окна браузера и при изменении размеров окна растягивался соответствующе?

1
  • @Дарья Бакланова, Если вам дан исчерпывающий ответ, отметьте его как верный (нажмите на галку рядом с выбранным ответом). 6 дек 2014 в 9:41

2 ответа 2

1

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

1
  • Ну я бы не был таким категоричным. Слева у шапки цвет вроде монотонный, поэтому можно прижать картинку к правому краю и подогнать цвет фона под картинку. Тогда слева, если картинка закончится, будет виден просто цветной фон, и вы при этом не найдете границы картинки
    – BOPOH
    5 дек 2014 в 10:08
1

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

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.