Home | О нас | Самоучитель иврита | Путеводитель по Израилю | Фотопутешествия | Города Израиля | Телефонный справочник | Еврейские имена | Еврейские праздники | Ивритская поэзия |
|
Теперь давайте усовершенствуем код странички Лены Петровой, воспользовавшись только что выученными тегами для построения таблиц.
Допустим, мы хотим разместить слева картинку, справа - имя, а внизу - текст. Нам понадобится для этого таблица с двумя строчками, в верхней из которых будет два столбца, а в нижней один. Код будет выглядеть следующим образом:
<table>
<tr>
<td>
<img src="lena.jpg" alt="Лена Петрова" width=300 height=200 border=0>
</td>
<td>
<b>Лена Петрова</b>
</td>
</tr>
<tr>
<td>
Я рада, что вы ко мне зашли!!
<p>
<i>Добро пожаловать!</i>
</td>
</tr>
</table>
Первая проблема, которая сразу же бросается в глаза: если мы просто вставим этот код после тега <body>, то все содержимое нашей страницы примостится в левом верхнем углу экрана. Решений здесь несколько, и, раз уж мы сейчас изучаем таблицы, то воспользуемся тем из них, которое еще раз продемонстрирует нам широкие возможности использования в коде табличных тегов. То есть, решим проблему при помощи таблицы: поместим в новую таблицу все содержимое страницы целиком, а саму эту "глобальную" таблицу поставим при помощи тегов <center>....</center> в середину страницы. «Глобальная» таблица будет состоять из одного ряда с одним столбцом в нем.
Если мы хотим, чтобы содержимое страницы не "упиралось" в самый верх экрана, то мы еще добавим сверху пару тегов <br>.
Весь наш код целиком примет следующий вид:
<html>
<head>
</head>
<body bgcolor=yellow>
<br><br>
<center>
<table>
<tr>
<td>
<table>
<tr>
<td>
<img src="lena.jpg" alt="Лена Петрова" width=300 height=200 border=0>
</td>
<td>
<b>Лена Петрова</b>
</td>
</tr>
<tr>
<td>
Я рада, что вы ко мне зашли!!
<p>
<i>Добро пожаловать!</i>
</td>
</tr>
</table>
</td>
</tr>
</table>
</center>
</body>
</html>
И вот что получается:
Пока не очень красиво. Но мы же пока что не использовали параметры для таблицы!