Модераторы: Illuminaty

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Тянущийся сайт 
:(
    Опции темы
mishaSL
Дата 16.1.2007, 11:59 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1046
Регистрация: 10.1.2007
Где: Санкт-Петербург

Репутация: 8
Всего: 54



Код:

Код

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251"/>
<title>Галерея векторной графики</title>
<link rel="stylesheet" type="text/css" href="css.css">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginheight="0" marginwidth="0" rightmargin="0">
<map name="navig">
<area  href="vector3.html" shape="poly" coords="262,120,324,103,324,138">
<area  href="vector2.html" shape="poly" coords="409,110,468,122,409,135">
</map>
<table height="100%" width="100%" bgcolor="#CCCCCC" cellpadding="0" cellspacing="0" border="0" >
<TR>
    <TD valign="top">
        <table cellpadding="0"  cellspacing="0" width="100%" height="34" >
        <tr>
            <td background="img/back_top_L.png" align="right" valign="top"><img src="img/back_top_R.png" width="1002" height="34"/></td>
        </tr>
        </table>
        <table cellpadding="0" cellspacing="0" width="100%" border="0" height="154">
        <tr>
            <td valign="top"><img src="img/rasporka.gif" width="30" height="1"/></td>
            <td valign="top" align="right" width="972" height="135"><img src="img/logo.png" width="972" height="154"/></td>
        </tr>
        </table>
        <table cellpadding="0" cellspacing="0" width="100%" border="0" height="17">
        <tr>
            <td><img src="img/rasporka.gif" width="30" height="1"/></td>
            <td align="right" valign="top" width="735"><img src="img/c2.png" width="735" height="56"/></td>
            <td align="right" valign="top" width="237" background="img/c3.png">
            <div><font class="link">Главная</font> <img src="img/rasporka.gif" width="10" height="1"/>
                 <font class="link">Линки</font><img src="img/rasporka.gif" width="10" height="1"/>
                 <font class="link">Контакты </font><img src="img/rasporka.gif" width="25" height="1"/></div></td>
        </tr>
        </table>
        <table cellpadding="0" cellspacing="0" width="100%" border="0" height="350">
        <tr>
            <td rowspan="2"><img src="img/rasporka.gif" width="30" height="1"/></td>
            <td align="right" valign="top" background="img/left_middle.png" width="89" rowspan="2"><img src="img/rasporka.gif" width="89" height="1"/></td>
            <td align="right" valign="top" width="521" rowspan="2"><p align="justify"><font class="standart"><br><br><br>Служба Яндекс.Рефераты предназначена для студентов и школьников, дизайнеров и журналистов, создателей научных заявок и отчетов - для всех, кто относится к тексту, как к количеству знаков.<br><br> Нажав на кнопку "Написать реферат" вы лично создаете уникальный текст, причем именно от вашего нажатия на кнопку зависит, какой именно текст получится - таким образом, авторские права на реферат принадлежат только вам.<br><br>Теперь никто не сможет обвинить вас в плагиате, ибо каждый текст Яндекс.Рефератов неповторим.<br><br>Текстами рефератов можно пользоваться совершенно бесплатно, однако при транслировании и предоставлении текстов в массовое пользование ссылка на Яндекс.Рефераты обязательна. </font></p></td>
            <td align="right" valign="top" background="img/midle_midle.png" width="125" rowspan="2"><img src="img/rasporka.gif" width="125" height="1"/></td>
            <td align="right" valign="top" background="img/c31.png" width="237" height="150"><center><font class="link"><img src="img/rasporka.gif" width="237" height="4"/><br>
            АРТ<br><img src="img/rasporka.gif" width="1" height="4"/><br><font class="selectlink">Вектор</font><br><img src="img/rasporka.gif" width="1" height="4"/><br>
            Рисунки<br><img src="img/rasporka.gif" width="1" height="4"/><br>Полиграфия<br><img src="img/rasporka.gif" width="1" height="4"/><br>Фото</font></center></td>
         </tr>
         <tr>
             <td align="right" valign="top" background="img/c32.png" width="237" height="200"><div align="center"><img src="img/rasporka.gif" width="1" height="17"/><br>
             <font class="link2">Отзывы<img src="img/rasporka.gif" width="10" height="1"/>Обои<img src="img/rasporka.gif" width="10" height="1"/>
             Рисунки<img src="img/rasporka.gif" width="49" height="1"/></font></div></td>
          </tr>
        </table>
        <table cellpadding="0" cellspacing="0" width="100%" border="0" height="150">
        <tr>
            <td><img src="img/rasporka.gif" width="30" height="1"/></td>
            <td align="right" valign="top" width="972"><img src="img/piece6.png" width="972" height="150" usemap="#navig" border="0"/></td>
         </tr>
        </table>
</TD>
</TR>
<TR>
<TD valign="top">
        <table cellpadding="0" cellspacing="0" width="100%" height="100%" border="0">
        <tr>
            <td><img src="img/rasporka.gif" width="940" height="1"/></td>
            <td background="img/replay.png" width="62" bgcolor="#FF0000" height="100%" valign="top"><img src="img/rasporka.gif" width="62" height="1"/></td>
        </tr>
        </table>
     </TD>
</TR>
</table>
</body>
</html>


В этом коде тянется основная таблица, я ее выделил серым, если хочешь чтобы тянулвсь какая-то отдельная часть сайта, то ставишь на этот элемент и на все родительские height="100%".
Но если честно, то верстка у тебя ужасная:
1. Вот это height="1"/> элемент xhtml, но пишется он вот так height="1" />, но т.к. у тебя не xhtml, то это не к чему.
2. Выноси большинство стилей (стили к таблицам и к другим повторяющимся элементам) в css
3. Если верстаешь и хочешь в этом коде что-то понять через месяц, то делай отступы.



А что касается высоты, то:
1. Если это просто html, т.е. в заголовках ничего не стоит (<html> так начинается страница), то достаточно указывать высоту у самого элемента.
2. Если это xhtml, то изначально необходимо указать в css следующее:
html {
height:100%;
}
body {
margin: 0;
padding: 0;
height:auto !important;
height:100%;
min-height:100%;
}
Далее указывать для необходимых элементов, только здесь надо быть аккуратным особенно с FireFox-ом и всегда проверять во всех браузерах.


Но лучше всего не использовать 100% высоту, конечно если без этого можно обойтись.




--------------------
Лучший способ научиться программированию - это посмотреть как это делают другие...
PM MAIL   Вверх
FireSnake
Дата 17.1.2007, 00:37 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 201
Регистрация: 15.9.2006
Где: Украина, Донецк

Репутация: нет
Всего: 1



Прочитал критику. Понял что верстка ужасная, но вот почему не понял...

Цитата

1. Вот это height="1"/> элемент xhtml, но пишется он вот так height="1" />, но т.к. у тебя не xhtml, то это не к чему.


У меня html а не xhtml, т.е. не страшно что я пробел не делаю (хотя спс, учту)

Цитата

но пишется он вот так height="1" />, но т.к. у тебя не xhtml, то это не к чему.


Как же не надо когда я ставлю этот слеш только в <img> где он обозначет окончание тега. Или я не прав?

Цитата

2. Выноси большинство стилей (стили к таблицам и к другим повторяющимся элементам) в css


Ну я так и делаю (для форматирования текста) правда надо было еще некоторые настройки таблиц загнать... Учту

Цитата

3. Если верстаешь и хочешь в этом коде что-то понять через месяц, то делай отступы.


Все там более/менее нормально (если мне придется разбираться, то с картинками, а сними гораздо понятней чем голый код)

Цитата

Если это просто html, т.е. в заголовках ничего не стоит 


Как это ничего не должно стоять? Ведь два самых главных тега в html это <Doctype> и <meta>.

Цитата

 если хочешь чтобы тянулвсь какая-то отдельная часть сайта, то ставишь на этот элемент и на все родительские height="100%".


Я так делал(если правильно понял что хотел автор сказать). Выходит так: сайт растягивается по высоте на сумму высот всех его элементов (в данном случае таблиц) + 100% высота экрана на этот элемент, где height="100%".
PM MAIL ICQ   Вверх
FireSnake
Дата 17.1.2007, 00:55 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 201
Регистрация: 15.9.2006
Где: Украина, Донецк

Репутация: нет
Всего: 1



P.S. Как мне выложить на винград архив со страничкой и имейджами?
PM MAIL ICQ   Вверх
mishaSL
Дата 17.1.2007, 13:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1046
Регистрация: 10.1.2007
Где: Санкт-Петербург

Репутация: 8
Всего: 54



Цитата(FireSnake @  17.1.2007,  00:37 Найти цитируемый пост)
Как же не надо когда я ставлю этот слеш только в <img> где он обозначет окончание тега. Или я не прав?


Этот слешь должен ставиться во всех незакрывающихся тегах (к примеру <img>, <meta>,<link> и т.д.), если doctype xhtml.

Цитата(FireSnake @  17.1.2007,  00:37 Найти цитируемый пост)
Ну я так и делаю (для форматирования текста) правда надо было еще некоторые настройки таблиц загнать... Учту


Я имею ввиду, что вот это к примеру:
Код

leftmargin="0" topmargin="0" marginheight="0" marginwidth="0" rightmargin="0"

в css можно написать так:
body {
padding: 0;
margin: 0;
}

А если у тебя на всех таблицах 
Код

cellpadding="0"  cellspacing="0"

То напиши в css:
table {
border-collapse: collapse;
}
table td {
padding: 0;
border-spacing: 0;
}

Цитата(FireSnake @  17.1.2007,  00:37 Найти цитируемый пост)

Как это ничего не должно стоять? Ведь два самых главных тега в html это <Doctype> и <meta>.


Это вопрос спорных. Многие, в том числе и я считают именно так, но скажем Лебедев верстает всегда не указывает <doctype> и везде все нормально отображается. Главное чтобы отображалось все правильно и весило меньше места.
Цитата(FireSnake @  17.1.2007,  00:37 Найти цитируемый пост)
Я так делал(если правильно понял что хотел автор сказать). Выходит так: сайт растягивается по высоте на сумму высот всех его элементов (в данном случае таблиц) + 100% высота экрана на этот элемент, где height="100%".

Значит что-то не так делаешь, помни что в сумме все элементы по ширине и по высоте не должны быть больше 100%



--------------------
Лучший способ научиться программированию - это посмотреть как это делают другие...
PM MAIL   Вверх
mishaSL
Дата 17.1.2007, 13:35 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1046
Регистрация: 10.1.2007
Где: Санкт-Петербург

Репутация: 8
Всего: 54



И еще тебе очень поможет http://validator.w3.org и http://jigsaw.w3.org/css-validator/


--------------------
Лучший способ научиться программированию - это посмотреть как это делают другие...
PM MAIL   Вверх
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.1298 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.