ЧЕТЫРНАДЦАТЫЙ УРОК

Сотворение мира и фреймов

В давние-стародавние времена, когда на Земле был один сплошной Рай, или по современному фрейм, жили были два человека - Адам и Ева. И бродили они по этому Раю как брат с сестрой. Ходили, держась за ручки, любуясь восходами и закатами, птичками и цветочками, и ни о чем "недозволенном" даже не догадывались. Питались разными ягодками и жизнь их текла размерено и скучно. Вот так (рис. 61):

Рис. 61. Жизнь в одном фрейме

Но вот появился Змей. А характер у этого Змея был самый что ни на есть гадский и подлючий. И замыслил он черное дело - разрушить эту райскую идиллию, поссорить Адама с Евой, накормить их Запретными плодами, чтоб жизнь им Раем не казалась…

Когда Адам бывал в отлучке, Змей подползал к Еве и начинал говорить всякие глупости. Будто бы Адам - мужик неполноценный, ни то ни се, ни рыба ни мясо, и толку от него как от козла молока. И будто бы даже самый завалящий козел может наделать кучу козлят, и будто бы он знает одно средство, почище всякой рекламной Виагры, после которой Адам станет, наконец, настоящим мужчиной и сделает жизнь Евы веселой и интересной, не такой пресной как в этом, забытом богом, раю.

После таких речей Ева ходила своя не своя, пока, наконец, не решилась.

- Адам, я хочу детей! - заявила она однажды.

Адам не понял.

- Тебя что, тут плохо кормят что ли? - удивился он, - Скушай вот яблочко.

- Не хочу этого яблока, - заупрямилась Ева, - Хочу другого, с Запретного Дерева. И хочу много-много детей.

Как ни отговаривал Адам женщину, бесполезно. Короче, съели они то яблоко. Адам сразу почувствовал себя настоящим мужчиной, и Ева это тоже поняла. И тут они застыдились друг друга, оборвали все фиговые листочки, приоделись как могли, и такими чучелами предстали взору Всевышнего. Ну, тот посмотрел на них, и сказал, что пугала в Раю не к чему и выпер бедолаг из Рая, к неописуемой радости Змея.

Вертикальные фреймы

Очутившись на грешной Земле, Ева сразу потребовала себе отдельный Фрейм. Со всеми удобствами. Пришлось Адаму отыскать нужный тег FRAMESET, без которых раздел имущества был бы невозможным. Тут же нашлись и подходящие атрибуты cols и rows. Повертел Адам их так и сяк, и решил разделить жилище на две комнаты, воспользовавшись атрибутом cols для вертикального разделения. И даже написал следующий код:

<FRAMESET cols="50%, 50%"> <frame src="eva.html"> <frame src="adam.html"> </FRAMESET>

А Еве объяснил так, что вот тебе, личный фрейм eva.html, обставляй его как хочешь, а на мою половину не лезь. Еве идея понравилось, только цифры ей не понравились. Не хочу, говорит, цифр, хочу, чтоб звезды были!

Что не сделаешь для любимой? Адам и переписал, как Ева просила. Ладно, говорит, главное, чтоб поровну было, по честному!

<FRAMESET cols="*, *"> <frame src="eva.html"> <frame src="adam.html"> </FRAMESET>

А Ева не унимается все.

- Нет, давай лучше цифрами,- говорит, - но без процентов!

Ну, Адаму нетрудно. Стер все и написал заново:

<FRAMESET cols="50, 50"> <frame src="eva.html"> <frame src="adam.html"> </FRAMESET>

А Ева опять засомневалась.

- Нет, - говорит, - ты меня обманываешь, давай мне цифрами, а тебе - звездой! И чтоб без процентов, тоже мне ростовщик нашелся!

Рассердился тут Адам.

- Ты сначала обставь свою страничку, потом уладим эти дела!

На том и порешили.

И вот какую страничку сделала себе Ева:

Eva.html:

<html lang="ru"> <HEAD> <TITLE>Страничка Евы </HEAD> <BODY bgcolor=pink> <H1>Я - ЕВА!</H1> <P> <IMG src="eva.jpg"> <P> Я - единственная и неповторимая!!!<br> Я - самая красивая!!! <br> Любите меня! <br> <IMG src="flowers.gif"> </BODY> </HTML>

Вот что у нее получилось (рис. 62):

Рис. 62. Страничка Евы

А вот страничка Адама:

Adam.html:

<html lang="ru"> <HEAD> <TITLE>Страничка Адама</TITLE> </HEAD> <BODY bgcolor=gray> <CENTER> <H1>Я - АДАМ!</H1> <P> <IMG src="adam.jpg"> <P> СТРАНИЧКА СТАРОГО ХОЛОСТЯКА </CENTER> </BODY> </HTML>

А вот что у него получилось (рис. 63):

Рис. 63. Страничка Адама

Ну, а теперь, осталось только добавить общий файл, объединяющий две странички eva.html и adam.html, который назван просто people.html:

People.html:

<html lang="ru"> <HEAD> </HEAD> <FRAMESET cols="*, *"> <frame src="eva.html"> <frame src="adam.html"> </FRAMESET> </HTML>

И вот, наконец-то их совместный сайт (рис. 64):

Рис. 64. Сайт, состоящий из двух фреймов

Еве сайт понравился. Но ей показалось, что половина - слишком мало для нее. Взяла она тогда файл people.html и переписала соотношение фреймов, где решила своим фреймом занять 800 пикселов, а Адаму - что останется:

<html lang="ru"> <HEAD> </HEAD> <FRAMESET cols="800, *"> <frame src="eva.html"> <frame src="adam.html"> </FRAMESET> </HTML>

Пришел Адам с неудачной охоты, злой, голодный, и чтобы успокоиться сразу сел за компьютер и открыл общий сайт people.html. И что он там увидел при разрешении 10024х768? А вот что (рис. 65):

Рис. 65. Проделки Евы

Поменял он разрешение на 800х600 и вообще не увидел своего фрейма. Обидно ему это стало. Взял он тогда и урезал Еву в процентах:

<html lang="ru"> <HEAD> </HEAD> <FRAMESET cols="20%, *"> <frame src="eva.html"> <frame src="adam.html"> </FRAMESET> </HTML>

И на пароль вообще поставил файлы все. И как бы Ева не упрашивала вернуть хотя бы половину, как не меняла разрешение экрана, people.html по ширине всегда имел такой вид (рис. 66):

Рис. 66. 20% фрейма Евы, и остальное - Адама

Горизонтальные фреймы

Ева терпела-терпела, сколько терпелки хватило, а потом говорит:

- Ладно, давай мириться. И разделим страничку по-новому. Тебе - 5 частей, а мне всего 4 части. Только чтоб фреймы были разделены по горизонтали, и чтобы я сверху была!

И посмотрела на Адама так чарующе, что Адам сразу растаял, снял все пароли и в файле people.html заменил cols на rows:

<html lang="ru"> <HEAD> </HEAD> <FRAMESET rows="4*, 5*"> <frame src="eva.html"> <frame src="adam.html"> </FRAMESET> </HTML>

И показал Еве что получилось (рис. 67):

Рис. 67. Горизонтальные фреймы:

Вложенные фреймы

Но такое разделение не понравилось никому - ни Еве, ни Адаму. Потому как все изображения получились с полосами прокрутки, и решили они тогда убавить верхний фрейм до 15%, назвать его header.html, и поместить там заголовок "Добро пожаловать в первый в мире сайт!"

Нижний же фрейм решено было разбить на две части, причем Еве отдать 30; а Адаму - остальное. И переписали многострадальный файл people.html по новому:

<html lang="ru"> <HEAD> </HEAD> <FRAMESET rows="15%, *"> <frame src="header.html"> <FRAMESET cols="30%, *"> <frame src="eva.html"> <frame src="adam.html"> </FRAMESET> </FRAMESET> </HTML>

Тут добавился новый файл header.html, вот какой он:

Header.html:

<html lang="ru"> <HEAD> <TITLE&tСтраничка Адама и Евы</TITLE> </HEAD> <BODY> <H1>ДОБРО ПОЖАЛОВАТЬ НА ПЕРВЫЙ В МИРЕ САЙТ!</H1> </BODY> </HTML>

И когда открыли файл people.html, то просто ахнули, так он им понравился. А вам понравилось (рис. 68)?

Рис. 68. Они строили, строили и наконец построили!

Ну, что ж, оставим в стороне наших героев, они потрудились на славу, и у них, надо признаться, неплохо получилось. Повторим же основные моменты!

1. Страничка разбивается на фреймы с помощью атрибута <FRAMESET>, который имеет закрывающуюся пару </FRAMESET>.
2. Чтобы разбить страничку на вертикальные фреймы, используют атрибут cols, для горизонтальной разбивки используют атрибут rows.
3. Каждый фрейм может содержать вложенный набор фреймов, наподобие матрешки.
4. Фреймы можно разделять между собой процентами (%), частями (*), либо в абсолютных числах (пикселах)
5. Страничка, содержащая теги FRAMESET не имеет атрибута BODY. Да он там и не нужен!

В следующем уроке мы продолжим тему фреймов. А пока… вам задание! Попытайтесь представить фреймами вашу квартиру. Удачи в решении квартирного вопроса!


К списку всех уроков

(В. Ахметзянова, 2005 г)