Сайт на всю высоту

alokey · June 14, 2011

Здравствуйте!! Хочу сделать сайт, который бы растягивался по высоте страницы.

Имеется разработанный дизайн главной страницы в виде картинки, мне нужно чтоб эта картинка растягивалась по всей высоте и не скрывалась вниз. Подскажите при помощи чего нужно позиционировать сайт. вот пример подобного сайта - leningradspb.ru

Подскажите пожалуйста при помощи каких "инструментов" создавался данный сайт или киньте ссылку где бы данная технология описывалась.

Vlad · June 15, 2011

Вы неудачный пример привели. Указанный сайт не растягивается по высоте, этот визуальный эффект достигается другими средствами. Если вам требуется масштабировать изображение, то универсальнее для этой цели использовать скрипты. Можно ещё через background-size это сделать.

alokey · June 15, 2011

Спасибо! попробую разобраться))

alokey · June 15, 2011

еще такой вопрос! вообще возможно ли такая реализация?

в контейнер вкладываем однопиксельное изображение и выставляем ему height: 100%.. это изображение квадратно растягивает div на всю высоту экрана.. в тот же контейнер вкладываем таблицу с width: 100%.. и в этой таблице верстаем картинку как нам удобно. в хроме прокатывает в IE не хочет работать

код css

body {margin: 0px;}
img {border: 0px;}

#str {
	position: fixed;
	margin-left: 5%;
	}

#tab {
	position: absolute;
	}

код html

<html>
<head>
<link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body>
<div id=bel></div>
<div id=str>
<div id=tab>
<table>
<tr><td>
<img src=img/web.png width=100%>
</td></tr>
</table></div>
<img src=img/1.gif height=100%>
</body>
</html>

Int · June 15, 2011

Параметры без кавычек, доктайп отсутствует, div не закрыт, устаревшие width и height, absolute вообще никого растягивать не будет потому что он absolute. Я бы на месте IE тоже не работал.

html, body {min-height:100%} забубень

Sign In

Сайт на всю высоту

Question

alokey

Link to comment

Share on other sites

4 answers to this question

Recommended Posts

Vlad

Link to comment

Share on other sites

alokey

Link to comment

Share on other sites

alokey

Link to comment

Share on other sites

Int

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information