<td>кредитование</td>

</tr>

</table>

Более подробно об ассортименте товаров и услуг вы можете узнать в нашем отделе сбыта.

</body>

</html>

Теперь сохраним выполненные изменения с помощью команды главного меню

Файл >
Сохранить
либо нажатием комбинации клавиш
Ctrl+S
, и откроем веб-страницу в окне Интернет-обозревателя. Результат выполненных действий представлен на рис. 2.21.

Рис. 2.21.
Форматирование таблицы

Ширина рамки таблицы задается соответствующим значением атрибута

border
. В нашем примере ему присвоено значение
2
, поэтому толщина рамки таблицы составляет 2 пикселя.

Как видно на рисунке, содержимое ячеек слишком близко прилегает к рамке таблицы, из-за чего таблица смотрится не совсем эргономично. Чтобы решить эту проблему, задействуем атрибут

cellpadding
тега
<table>
. Напомним, что с помощью данного атрибута можно задать расстояние от содержимого ячеек до линий рамки таблицы. В нашем примере присвоим атрибуту
cellpadding
значение
10
– в этом случае расстояние от содержимого ячеек таблицы до ее рамок будет составлять 10 пикселей.

Кроме этого, с помощью атрибута

align
тега
<table>
мы центрируем таблицу по середине веб-страницы, а этот же атрибут в применении с тегами
<td>
позволит нам выровнять содержимое ячеек по центру.

В конечном итоге программный код нашей страницы должен выглядеть так, как показано в листинге 1.8.

Листинг 1.8.
Центрирование таблицы и ячеек

<html>

<head>

<title>Компания 'Торговый мир'</title>

</head>

<body>

<h1>Добро пожаловать!</h1>

<i>Мы рады приветствовать вас на сайте нашей компании ООО «Мир торговли»</i>. Уже более <u>пяти лет</u> мы занимается продажей товаров и оказанием услуг. <b>Ниже представлены списки основных позиций, которые мы рады предложить</b>.<br>

<table border='2' align='center' cellpadding='10'>

<tr>

<td bgcolor='yellow' align='center'><b>Товары</b></td>

<td bgcolor='yellow' align='center'><b>Услуги</b></td>

</tr>

<tr>

<td align='center'>промтовары</td>

<td align='center'>грузоперевозки</td>

</tr>

<tr>

<td align='center'>стройматериалы</td>

<td align='center'>ответственное хранение</td>

</tr>

<tr>

<td align='center'>одежда, обувь</td>

<td align='center'>консультирование</td>

</tr>

<tr>

<td align='center'>детские игрушки</td>

<td align='center'>кредитование</td>

</tr>

</table>

Более подробно об ассортименте товаров и услуг вы можете узнать в нашем отделе сбыта.

</body>

</html>

В результате выполненных изменений наша страница будет выглядеть так, как показано на рис. 2.22.

Рис. 2.22.
Центрирование таблицы и содержимого ячеек

Далее вставим в наш документ изображение. Об этом читайте в следующем разделе.

Вставка изображений

Напомним, что для вставки изображений в языке HTML используется тег

<img>
. Этот тег имеет обязательный атрибут
src
, необходимый для указания адреса изображения. Если файл с изображением находится в том же каталоге, что и файл веб-страницы, то в качестве адреса изображения достаточно ввести имя его файла. Такой путь к файлу изображения называется относительным. Если же файл изображения находится в другом месте (например, на другом веб-узле), то значением атрибута
src
будет являться абсолютный путь к файлу (например, ).

В нашем примере файл изображения будет иметь название

Образец.jpg
. Доработаем наш программный код так, как показано в листинге 1.9.

Листинг 1.9.
Вставка изображения в документ

<html>

<head>

<title>Компания 'Торговый мир'</title>

</head>

<body>

<h1>Добро пожаловать!</h1>

<i>Мы рады приветствовать вас на сайте нашей компании ООО «Мир торговли»</i>. Уже более <u>пяти лет</u> мы занимается продажей товаров и оказанием услуг. <b>Ниже представлены списки основных позиций, которые мы рады предложить</b>.<br>

<table border='2' align='center' cellpadding='10'>

<tr>

<td bgcolor='yellow' align='center'><b>Товары</b></td>

<td bgcolor='yellow' align='center'><b>Услуги</b></td>

</tr>

<tr>

Добавить отзыв
ВСЕ ОТЗЫВЫ О КНИГЕ В ИЗБРАННОЕ

0

Вы можете отметить интересные вам фрагменты текста, которые будут доступны по уникальной ссылке в адресной строке браузера.

Отметить Добавить цитату