Веб-Самоделкин. Как самому создать сайт быстро и профессионально
Шрифт:
Однако в Интернете гиперссылки широко используются не только для того, чтобы переходить на страницы одного и того же сайта, но и для перехода на другие веб-ресурсы. Чтобы решить эту задачу, нужно в программном коде гиперссылки указать веб-адрес требуемого ресурса. Рассмотрим, как это делается, на конкретном примере.
Сделаем из нашей страницы Пример.html гиперссылку на популярный портал www.mail.ru. Для этого подкорректируем программный код так, как это показано на рис. 2.14.
Рис. 2.14.
Как видно на рисунке, из кода ссылки мы убрали имя страницы Test.html, добавив вместо него адресВ остальном программный код страницы остался прежним. Сохраним выполненные изменения с помощью команды главного меню Файл Сохранить или нажатием комбинации клавиш Ctrl+S, и запустим файл Пример.html.
Внешне вид веб-страницы не изменится – она будет выглядеть точно так же, как и на рис. 2.13. Но если теперь щелкнуть мышью на ссылке здесь, то в результате откроется главная страница портала www.mail.ru.
Таким образом, в данном разделе мы на конкретном примере рассмотрели основные действия по созданию простейшей веб-страницы. Однако чтобы более детально изучить возможности языка HTML, необходимо познакомиться с его основными тегами. Некоторые из них мы уже знаем, но в реальности их намного больше. Об этом и пойдет речь в следующем разделе.
Основные теги языка HTML
Здесь мы познакомимся с наиболее востребованными тегами языка программирования HTML. Отметим, что многие теги имеют свои атрибуты, о которых также будет рассказано в данном разделе. Мы будем рассматривать все теги (даже те, с которыми уже познакомились) в алфавитном порядке.
ВНИМАНИЕ
Не забывайте, что многие теги HTML-языка являются парными – например, <body> </body>, <b> </b>, и т. д.
Тег <a>, как мы уже знаем, предназначен для создания гиперссылок в тексте веб-страницы. Напомним, что гиперссылка является одним из ключевых элементов любого веб-ресурса, поэтому важность данного тега сложно переоценить. Этот тег имеет следующие атрибуты:
• accesskey – назначение для гиперссылки «горячей клавиши»;
• href – определение адреса, на который ведет гиперссылка;
• name – именование областей веб-страницы;
• tabindex – установка порядка перехода по гиперссылкам;
• target – определение окна для отображения объекта гиперссылки.
Тег <b> предназначен для выделения текста полужирным шрифтом. Иначе говоря, весь текст, находящийся между тегами <b> </b>, будет отображаться полужирным шрифтом.
С помощью тега <basefont> вы можете изменить внешний вид всего текста. Этот тег имеет атрибут size, предназначенный для изменения размера шрифта текста.
Тег <big> позволяет увеличить шрифт текста по сравнению с соседним текстом, а с помощью тега <blockquote> вы можете создать в документе блок цитаты.
Одним из ключевых тегов языка программирования HTML является парный тег <body>. Как мы уже отмечали ранее, с помощью этого тега идентифицируется
основной текст документа. Иначе говоря, все, что вы хотите поместить на веб-страницу, должно располагаться между тегами <body> </body>. Данный тег имеет несколько атрибутов, которые перечислены ниже.• alink, link и vlink – позволяют установить цвет гиперссылок;
• background – выбор графического фона;
• bgcolor – изменение цвета фона веб-страницы (применение данного атрибута мы на конкретном примере рассмотрели в предыдущем разделе);
• bgproperties – установка режима перемещения графического фона при пролистывании веб-страницы;
• bottommargin – позволяет редактировать высоту нижнего поля;
• leftmargin – позволяет редактировать ширину левого поля;
• marginheight – позволяет редактировать высоту верхнего и нижнего полей;
• marginwidth – позволяет редактировать ширину левого и правого полей;
• rightmargin – позволяет редактировать ширину правого поля;
• text – изменение цвета текста (применение данного атрибута мы на конкретном примере рассмотрели в предыдущем разделе);
• topmargin – позволяет редактировать высоту верхнего поля.
Тег <br>, как мы уже отмечали ранее, предназначен для создания новой строки (то есть для переноса текста на нижеследующую строку). Этот тег имеет один атрибут – clear, предназначенный для предотвращения переноса слов текста.
С помощью тега <caption> вы можете снабдить таблицу заголовком, а атрибут данного тега align позволяет установить признак выравнивания заголовка таблицы.
Для центрирования элементов веб-страницы предназначен тег <center>.
<col> – данный тег позволяет создать неструктурную группу столбцов таблицы. Он имеет перечисленные ниже атрибуты.
• align – атрибут позволяет задать признак выравнивания данных в ячейках группы по горизонтали;
• bgcolor – с помощью данного атрибут задается цвет фона ячеек группы;
• char – выбор символа, устанавливающего порядок выравнивания данных в ячейках группы;
• span – установка числа столбцов в группе;
• valign – установка признака выравнивания данных в ячейках группы по вертикали.
<colgroup> – с помощью данного тега создается структурная группа столбцов таблицы. Он имеет те же атрибуты, что и тег <col>.
<dd> – данный тег позволяет отметить статью определения в списке определений.
<del> – с помощью данного тега текст снабжается признаком зачеркивания.
<div> – данный тег позволяет разделить веб-страницу на области. Это бывает целесообразно при использовании стилей. У данного тега есть атрибут class, с помощью которого можно сформировать список исключений.
<font> – с помощью данного тега осуществляется изменение внешнего вида текста. Этот тег имеет перечисленные ниже атрибуты.
• color – изменение цвета текста;
• face – изменение шрифта текста;
• size – изменение размера шрифта.
<form> – это тег используется для создания форм. Он также имеет несколько важных атрибутов, которые перечислены ниже.