|
Добрый день. Я сейчас прохожу курс повышения квалификации - "Профессиональное веб-программирование". Мне нужно получить диплом по этому курсу. Я так полагаю нужно его оплатить чтобы получить диплом о повышении квалификации. Как мне оплатить этот курс?
|
Инспектор
Вы можете этот курс.
Опубликован: 04.07.2012 | Уровень: специалист | Доступ: платный
Лекция 2:
Язык гипертекстовой разметки HTML
Тело документа - контейнер BODY
Описание тегов тела документа следует начинать с тега BODY. В отличие от тега HEAD, тег BODY имеет атрибуты.
Атрибут BACKGROUND определяет фон, на котором отображается текст документа. Если источником для фона HTML- документа является графический файл image.gif, то в открывающем теге тела BODY появляется соответствующий атрибут:
<ВОDY ВАСКGROUND="image.gif">
Следует заметить, что разные интерфейсы пользователя поддерживают различные дополнительные атрибуты для тега BODY.
| Атрибут | Описание |
|---|---|
| MARGINHEIGHT | определяет ширину (в пикселах) верхнего и нижнего полей документа. Работает только в браузерах Netscape. |
| TOPMARGIN | определяет ширину (в пикселах) верхнего полz документа. Работает только в браузерах Internet Explorer. |
| MARGINWIDTH | определяет ширину (в пикселах) левого и правого полей документа. Работает только в браузерах Netscape. |
| LEFTMARGIN | определяет ширину (в пикселах) левого и правого полей документа. Работает только в браузерах Internet Explorer. |
| BACKGROUND | определяет изображение для "заливки" фона. Значение задается в виде полного URL или имени файла с картинкой в формате GIF или JPG. |
| BGCOLOR | определяет цвет фона документа. |
| TEXT | определяет цвет текста в документе. |
| LINK | определяет цвет гиперссылок в документе. |
| ALINK | определяет цвет подсветки гиперссылок в момент нажатия. |
| VLINK | определяет цвет гиперссылок на документы, которые вы уже просмотрели. |
Значения атрибутов BGCOLOR, TEXT, LINK, ALINK и VLINK задаются либо RGB-значением в шестнадцатиричной системе, либо одним из 16 базовых цветов. Например:
<HTML> <BODY BACKGROUND="image.jpg" BGCOLOR="black" TEXT="#FFFFFF" LINK="#FF0000" VLINK="#656565" MARGINHEIGHT="25" TOPMARGIN="25" LEFTMARGIN="45" MARGINWIDTH="45"> Текст документа. </BODY> </HTML>
Теги управления разметкой
| Теги | Описание тегов | Атрибуты | Описание атрибутов |
|---|---|---|---|
| от <Н1> до <Н6> | Заголовки. Обозначают начало раздела документа. В стандарте определено 6 уровней заголовков: от Н1 до Н6. Текст, окруженный тегами <Н1></Н1>, получается большим - это основной заголовок. Если текст окружен тегами <Н2></Н2>, то он выглядит несколько меньше (подзаголовок); текст внутри <НЗ></НЗ> еще меньше и так далее до <Н6></Н6>. | ||
| <P> | Тег <P> применяется для разделения текста на параграфы. В нем используются те же атрибуты, что и в заголовках. | АLIGN |
Позволяет выравнять текст по левому или правому краю, по центру или ширине. По умолчанию текст выравнивается по левому краю. Данный атрибут применим также к графике и таблицам. Возможные значения атрибута:
|
| <ВR> | Принудительный перевод строки используется для того, чтобы нарушить стандартный порядок отображения текста. При обычном режиме интерпретации программа интерфейса пользователя отображает текст в рабочем окне, автоматически разбивая его на строки. | СLЕАR | Используется для того, чтобы остановить в указанной точке обтекание объекта текстом и затем продолжить текст в пустой области за объектом. Возможные значения атрибута: LEFT, RIGHT, ALL. |
| <NOBR> | Дает браузеру команду отображать весь текст в одной строке, не обрывая ее. Если текст, заключенный в <NOBR>, не поместится на экране, браузер добавит в нижней части окна документа горизонтальную полосу прокрутки. |
Списки в HTML
Еще одним способом структурирования текстов являются списки. В НТМL имеются следующие виды списков:
- ненумерованный список (тег <UL>);
- нумерованный список;
- список определений.
Ненумерованный список записывается в виде последовательности:
<UL> <LI>первый элемент списка <LI>второй элемент списка <LI>третий элемент списка </UL>
Можно задавать любой тип маркера в произвольном месте списка. Ниже перечислены теги с атрибутами стандартных маркеров:
- <UL TYPE=DISC> Стандартные маркеры списков первого уровня (по умолчанию).
- <UL TYPE=СIRCLE> Маркеры в виде окружностей.
- <UL TYPE=SQUARE> Квадратные маркеры.
Тег <OL> вместе с атрибутом TYPE позволяет создавать нумерованные списки, используя в качестве номеров не только обычные числа, но и строчные и прописные буквы, а также строчные и прописные римские цифры:
<ОL ТYРЕ=l> Тег создает список с нумерацией в формате 1., 2., 3... <ОL ТYРЕ=А> Тег создает список с нумерацией в формате А., В., С... <OL ТYРЕ=а> Тег создает список с нумерацией в формате а., b., с... <ОL ТYРЕ=I> Тег создает список с нумерацией в формате I., II., III...
Теги списка <DL>, <DT>, <DD> используют для создания списка терминов и их определений по следующей схеме :
<DL> <DT>Термин</DT> <DD>Определение</DD> </DL>
Комментарии
Комментарии HTML начинаются с символа "<!--" и оканчиваются символом "-->". Содержимое комментариев браузер не выводит на экран.
Гипертекстовые ссылки
Для записи гипертекстовой ссылки используется тег <А>, который называют "якорем". Якорь имеет несколько атрибутов, главным из которых является HREF. Простую ссылку можно записать в виде
<А НREF="http://www.example.com"> Пример гипертекстовой ссылки </А>
Значение атрибута HREF и есть адрес документа. Форма записи этого адреса задается в виде URL.
Графика в HTML.
Для вставки изображения в HTML документ используется тег <IMG> с обязательным атрибутом SRC, значением которого является URL графического файла.
Пример:
<IMG SRC="myimage.gif" ALT="Картинка">.
Тегом HTML, который заставляет браузер выводить изображение, является <IMG> с обязательным атрибутом SRC (SouRCe, источник). Имя файла представляет собой имя выводимого графического файла. Замыкающего тега не требуется.
Пример вставки изображения:
<IMG SRC="image.gif" ALT="ИЗОБРАЖЕНИЯ">
Изображения на веб-странице могут использоваться в качестве гипертекстовых ссылок, как и обычный текст. Читатель щелкает на изображении и отправляется на другую страницу или переходит к другому изображению. Для обозначения изображения как гипертекстовой метки используется тот же тег <A>, что и для текста, но между <A> и </A> вставляется тег изображения <IMG> :
Тег <IMG> имеет один обязательный атрибут SRC и yнесколько необязательных: ALT, ALIGN, USEMAP, HSPACE, VSPACE, BORDER, WIDTH, HEIGHT.
| Атрибут | Описание |
|---|---|
| SRC | Указывает файл изображения и путь к нему |
| ALT | Позволяет указать текст, который будет выводиться вместо изображения браузерами, неспособными представлять графику |
| АLIGN | Определяет положение изображения относительно окружающего его текста |
| USEMAP | Если щелкнуть кнопкой мыши на активной области изображения, для которого определен атрибут USEMAP, произойдет переход по ссылке на документ, заданный для этой области |
| BORDER | Определяет толщину рамки вокруг изображения. Если значение равно нулю, рамка отсутствует |
| HSPACE | Задает горизонтальное расстояние между вертикальной границей страницы и изображением, а также между изображением и огибающим его текстом. |
| VSPACE | Задает вертикальное расстояние между строками текста и изображением |
| WIDTH , HEIGHT | Задают значения размеров изображения по горизонтали и по вертикали соответственно |
Средства описания таблиц в HTML
Для описания таблиц используется тег <ТАВLЕ>. Строки таблицы задается с помощью тегов <ТR></ТR>. Внутри строки таблицы обычно размещаются ячейки с данными. Каждая ячейка, содержащая текст или изображение, должна быть окружена тегами <ТD></ТD>. Заголовки для столбцов и строк таблицы задаются с помощью тега заголовка <ТН></ТН>. Эти теги подобны <ТD></ТD>, однако текст, заключенный между тегами <ТН></ТН>, автоматически выделяется жирным шрифтом и по умолчанию располагается посередине ячейки. Тег <CAPTION> позволяет создавать заголовки таблицы.
| Атрибут | Описание |
|---|---|
| NOWRAP | При использовании атрибута NOWRAP с тегами <ТН> или <ТD> длина ячейки расширяется настолько, чтобы заключенный в ней текст поместился в одну строку. |
| СОLSPAN | Если требуется сделать какую-нибудь ячейку шире, чем верхняя или нижняя, то можно воспользоваться атрибутом СОLSPAN, чтобы расширить ее на любое количество обычных ячеек. |
| ROWSPAN | Подобен атрибуту СОLSPAN, только он задает число строк, на которые расширяется ячейка. |
| WIDТН | Можно поместить его в тег <ТАВLЕ>, чтобы задать ширину всей таблицы, или можно использовать в тегах <ТD> или <ТН>, чтобы задать ширину ячейки или группы ячеек. Ширину можно указывать в пикселах или в процентах. |
| СЕLLРАDDING | Определяет ширину пустого пространства между содержимым ячейки и ее границами. |
| АLIGN, VALIGN | Теги <ТR>, <ТD> и <ТН> можно модифицировать с помощью атрибутов ALIGN и VALIGN. Атрибут АLIGN определяет выравнивание текста и графики по горизонтали. VALIGN осуществляет выравнивание текста и графики внутри ячейки по вертикали. |
| BORDER | В теге <ТАВLЕ> определяет, как будут выглядеть рамки, то есть линии, окружающие ячейки таблицы и саму таблицу. |
| СЕLLSPACING | Определяет ширину промежутков между ячейками в пикселах. Если этот атрибут не указан, по умолчанию задается величина, равная двум пикселам. |
| BGCOLOR | Позволяет установить цвет фона. В зависимости от того, с каким тегом он применяется, цвет фона может быть установлен для всей таблицы (TABLE), для строки (TR) или для отдельной ячейки (TD). Значением данного атрибута является RGB-код или стандартное название цвета. |
| BACKGROUND | Задает фоновое изображение для таблиц. Применим к тегам TABLE и TD. Его значением является URL файла с фоновым изображением. |
Сергей Крупко
Галина Башкирова
|
Здравствуйте, недавно закончила курс по проф веб программиованию, мне прислали методические указания с примерами тем, однако темы там для специальности Системный администратор информационно-коммуникационных» систем.
|
