разработка сайта (урок1)

advertisement
Урок 1
• Сайт – это совокупность гипертекстовых страниц
(чаще имеющая древовидную структуру) для
представления предприятия, фирмы (корпоративные
сайты), для представления школ (школьные сайты),
частных лиц (личные сайты).
• Гипертекстовые страницы, которые составляют сайт,
записываются на специальном языке HTML.
• Средства HTML служат для указаний браузеру, в
каком виде выводить на экран текст и графику, а
также позволяют записывать на страницах
гиперссылки.
Структура HTML - кода
• Тег <HTML> должен открывать программу, а тег
</HTML> - закрывать ее.
• Между этими двумя основными тегами располагается
головная часть программы и тело.
• Головная часть содержит информацию, которая не
отображается на экране монитора при просмотре
web-страницы, а тело – все то, что мы видим на
экране монитора как web-страницу.
Базовая структура любого HTML-документа
выглядит так:
<!DOCTYPE HTML PUBLIC”-//W3C//DTD HTML 3.2//EN”>
<HTML>
<HEAD>
<!-- заголовочная информация об этом документе, которая не
показывается на экране -->
</HEAD>
<BODY>
<!--- весь HTML-текст для показа на экране -->
</BODY>
</HTML>
Строка: <!DOCTYPE HTML PUBLIC”-//W3C//DTD HTML 3.2//EN”> не является
технологическим требованием, но сообщает браузеру, для какой версии HTML
был написан данный документ.
Заголовки
• В HTML-документе поддерживаются заголовки шести
уровней при помощи конструкции
<Hn>Текст заголовка</Hn>
• В качестве n следует использовать одну из цифр 1-6,
обозначающую уровень заголовка.
• Тегом H1 нужно выделять заголовки первого уровня,
тегом H2 – заголовки второго уровня и так далее.
• Использовать заголовки нужно очень аккуратно в
соответствии с их иерархическими уровнями в
структуре документа.
• Не следует использовать теги Hn для выделения
обычного текста.
Разделение на абзацы
• Для того, чтобы выделить часть текста как абзац, в
HTML используется тег <P>.
• Он выглядит так:
<P>Текст абзаца</P>
• Браузер выполняет команду Р следующим образом:
Перед абзацем выводиться пустая строка
Абзац выравнивается по левому краю
Между словами помещается ровно по одному пробелу
независимо от того, сколько пробелов проставлено в HTML-коде
 Перенос текста на новую строку происходит тогда, когда
очередное слово не помещается в экранной строке, а не тогда,
когда новая строка начинается в HTML-коде



Работа со шрифтами
• Язык HTML позволяет указать браузеру, в каком
начертании следует отображать на экране монитора
фрагменты текста: Курсивом, Жирным,
Подчеркнутым или их комбинации.
• Теги начертания шрифтов
<B>Это жирный</B>
<I>Это курсив</I>
<U>Это подчеркнутый</U>
• Слишком частое применение тегов начертания
шрифтов может сделать текст неудобным для
чтения.
Кодирование цвета
Имя
Код
Описание
Имя
Код
Описание
black
#000000
черный
green
#008000
зеленый
silver
#C0C0C0
серебряный
lime
#00FF00
светло-зеленый
gray
#808080
серый
olive
#808000
оливковый
white
#FFFFFF
белый
maroon
#800000
коричневый
navy
#000080
темно-синий
red
#FF0000
красный
blue
#0000FF
синий
purple
#800080
темно-сиренев
teal
#008080
петроль
fuchsia
#FF00FF
сиреневый
aqua
#00FFFF
голубой
yellow #FFFF00
желтый
Выравнивание абзацев
• <P align=left> - выравнивает абзац
по левому краю
• <P align=right> - выравнивает абзац
по правому краю
• <P align=center> - выравнивает
абзац по центру
• <P align=justify> - выравнивает
абзац по ширине
Download