background... как растянуть картинку

Статус
В этой теме нельзя размещать новые ответы.
Ardis

Ardis

Профессор
Регистрация
26 Мар 2008
Сообщения
209
Реакции
42
Доброго времяни суток!
Подскажите, плз, как сделать, чтобы фон (в виде графического файла fon.jpg) растягивался в окне браузера?!
поиск ни че не дал... я удивлен что сss такое не может оО

repeat - картинка бесконечно повторяется по горизонтали и вертикали, заполняя собой все фоновое пространство браузера;

repeat-x - картинка повторяется по горизонтали;

repeat-y - картинка повторяется по вертикали;

no-repeat - картинка не повторяется.....

А растянуть нет....
как быть?:confused:
 
В css3 это делается довольно просто, а пока он полностью не поддерживается, приходится извращаться:
HTML: 
<html>
    <head>
	<style type="text/css">
		html {height:100%;}
		body {height:100%; margin:0; padding:0;}
		#bg {position:fixed; top:0; left:0; width:100%; height:100%;}
		#page {position:relative; z-index:1;}
	</style>
        <!-- По традиции, для говнобраузера свое: -->
	<!--[if lte IE 6]>
	<style type="text/css">
		html {overflow-y:hidden;}
		body {overflow-y:auto;}
		#bg {position:absolute; z-index:-1;}
		#page {position:static;}
	</style>
	<![endif]-->
    </head>
    <body>
        <div id="bg"><img src="fon.jpg" width="100%" height="100%" alt="" /></div>
        <div id="page">
            <!-- Здесь — вся остальная часть страницы -->
        </div>
    </body>
</html>
Т.е., фон в css растягивать нельзя, зато можно растягивать элемент img. Вот этим и пользуемся.
P.S.: Вашей теме место в форуме "Веб-дизайн".
 
Сяп, работает, но 1 не радует одно то что если страница не вмещается в дисплее по вертикали (т.е. прокручивается) то и фон прокручивается... нельзя сделать что бы фон растягивался на всю именно страницу а не на дисплей. надеюсь понятно объянил :)
P.S.: Вашей теме место в форуме "Веб-дизайн".
Нажмите для раскрытия...
да кстати что т осразу не сообразил... но и тут вроде норм...
<!-- По традиции, для говнобраузера свое: -->
Нажмите для раскрытия...
:D
 
Честно-говоря, вряд-ли. Нету времени сейчас особо пробовать, но, по крайней мере без javascript, которым при каждой загрузке узнавать высоту окна, вряд-ли.
 
Сяп, работает, но 1 не радует одно то что если страница не вмещается в дисплее по вертикали (т.е. прокручивается) то и фон прокручивается... нельзя сделать что бы фон растягивался на всю именно страницу а не на дисплей. надеюсь понятно объянил :)
Нажмите для раскрытия...
Это ппц будет... Сравни, разрешения 1024 и 2000, искажение картинки, растягивается по ширине больше, чем в два раза. Т.е. при увеличении разрешения ширина растет, а высота наоборот уменьшается, искажение все сильней. Я уже не говорю, если на страницах различное колличество текста, высота может скакать от 800 до 5000 и более.
 
Да не, если фон более-однородный, (градиент какой-нибудь хитрый, например, который нельзя сделать, просто указав фон страницы в css), то выглядеть будет сносно, но вообще я хотел сказать то же самое: оно нафиг не надо. А если надо обязательно, то все-таки нужно рыть javascript.
 
Это ппц будет... Сравни, разрешения 1024 и 2000, искажение картинки, растягивается по ширине больше, чем в два раза. Т.е. при увеличении разрешения ширина растет, а высота наоборот уменьшается, искажение все сильней. Я уже не говорю, если на страницах различное колличество текста, высота может скакать от 800 до 5000 и более.
Нажмите для раскрытия...
Картинка смотрится в любом разрешении нормально
Да не, если фон более-однородный, (градиент какой-нибудь хитрый, например, который нельзя сделать, просто указав фон страницы в css), то выглядеть будет сносно, но вообще я хотел сказать то же самое: оно нафиг не надо. А если надо обязательно, то все-таки нужно рыть javascript.
Нажмите для раскрытия...
я не знаю javascript...:confused:

по ходу принется резать картинуку
 
а реально растянуть картинку по всей ячейке в таблице?
 
  • Заблокирован
  • #10
изучаем css, после этого все станет возможен в напровлении html+css :)
 
Статус
В этой теме нельзя размещать новые ответы.
Назад
Сверху