растягиваем background-image

Хелкар · March 27, 2012

на сайте в css написано

body {

background-attachment:fixed;

background-color: #9bc52b;

background-image: url(images/background.jpg);

font-size: 80%;

}

как сделать чтобы картинка background.jpg сама растягивалась под любое окно браузера? а то на одном разрешении она нормально, на другом разрешении начинает моститься, а при уменьшении окна браузера она вообще не взалает...

Softlink · March 27, 2012

background-size

Хелкар · March 27, 2012

пасиб,что тоя не догадался посомтреть там :facepalmxd:

Хелкар · March 27, 2012

теперь такой же вопрос с хедером.

#header {

margin: auto;

background-attachment:fixed;

background-image: url(images/main_header1.png);

height: 250px;

width: 685px;

}

background-attachment:fixed не помог...

Alma · March 27, 2012

background-size

Это не помогает?

или вот

или картинку надо не в background, а в html - <img.../> и задать ей ширину 100%, но это надо от конкретного случая отталкиваться...

Хелкар · March 28, 2012

проблема в том что у меня стоит картинка бекграунда. она не двигается. на этой картинке посередине написан логотип наш. далее на этот логтип закрывает PNGшная картинка прозрачная. и хотелось бы чтобы мой контент при скролинге не наползал на логотип. для этого и нужно чтобы хедер был неподвижен так же как и фон сайта.

http://gorohdntv.narod.ru/ вот мой сайтик

Edited March 28, 2012 by Хелкар

Alma · March 28, 2012

проблема в том что у меня стоит картинка бекграунда. она не двигается. на этой картинке посередине написан логотип наш. далее на этот логтип закрывает PNGшная картинка прозрачная. и хотелось бы чтобы мой контент при скролинге не наползал на логотип. для этого и нужно чтобы хедер был неподвижен так же как и фон сайта.

а куда, по вашему, в этом случае будет деваться скроллируемая область?

она-то может под хедер заползать, но он прозрачный

1. переделать хедер - вместо пнг картинки использовать ваш логотип, но с вашим бг это будет сложно угадать, что бы стыков не было видно, да еще и при разных разрешенях...

2. убрать скролл с <body> и добавить его на <div id="main_content">. (используйте свойства position и overflow).

Хелкар · March 28, 2012

что то я не подумал что контерн заползает под зафиксированный хедер,но так как он прозрачный то этого не заметно :rofl:

попробую второе, но тут уже начальство говорит что и так сойдет

Alma · March 28, 2012

попробую второе, но тут уже начальство говорит что и так сойдет

ага, главное выдержать паузу

и половина проблем сама отпадает

Хелкар · March 28, 2012

таааак,теперь тот же самый вопрос возник с боковой менюшкой. хочется тчобы она стояла на месте(тогда можно будет только бекграунд подрисовать чтоб на месте меню были финтифлюшки).

но менюшка скролится :facepalmxd:

Alma · March 28, 2012

таааак,теперь тот же самый вопрос возник с боковой менюшкой. хочется тчобы она стояла на месте(тогда можно будет только бекграунд подрисовать чтоб на месте меню были финтифлюшки).
но менюшка скролится


#mainmenu {
    float: left;
    height: 178px;
    left: 287px;
    [b]position: fixed;[/b]
    top: 279px;
    width: 286px;
}

Sign In

растягиваем background-image

Question

Link to comment

Share on other sites

10 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information