Поделиться через

Основы HTML

Большинство браузеров имеют возможность изучения html-источника страниц, которые вы просматриваете. При просмотре источника вы увидите ряд тегов HTML (языка разметки гипертекста), окруженных угловыми скобками(<>), перемежаемыми с текстом.

Приведенные ниже действия используют HTML-теги для создания простой веб-страницы. В этих шагах вы введете обычный текст в файл в Блокноте, внесите несколько изменений, сохраните файл и перезагрузите страницу в браузере, чтобы увидеть изменения.

Создание HTML-файла

  1. Откройте блокнот или любой редактор обычного текста.

  2. В меню "Файл" выберите "Создать".

  3. Введите следующие строки:

    <HTML>
<HEAD>
<TITLE>Top HTML Tags</TITLE>
</HEAD>
</HTML>

  4. В меню "Файл" выберите "Сохранить" и сохраните файл как c:\webpages\First.htm. Оставьте файл открытым в редакторе.

  5. Перейдите в браузер и в меню "Файл ", выберите "Открыть" или введите file://C:/webpages/first.htm в поле редактирования URL-адреса браузера. Вы увидите пустую страницу с заголовком окна "Верхние HTML-теги".

    Обратите внимание, что теги связаны и включаются в угловые скобки. Теги не чувствительны к регистру, но прописные буквы часто используются, чтобы сделать их более заметными.

    Тег <HTML> начинает документ, а тег </HTML> заканчивает его. Конечные теги (не всегда обязательные) совпадают с начальным тегом, но имеют косую черту (/) перед тегом. Между угловой скобкой (<) и началом тега не должно быть пробелов.

  6. Вернитесь к Блокноту и после <строки /HEAD> введите:

    <BODY>
    HTML is swell.
    Life is good.
</BODY>

  7. В меню "Файл" выберите "Сохранить".

  8. Вернитесь в браузер и обновите страницу.

    Слова будут отображаться в клиентской области окна браузера. Заметьте, что на возврат каретки не обращают внимание. Если требуется разрыв строки, необходимо включить <BR> тег после первой строки.

    Для всех шагов, описанных ниже, вставьте текст в любом месте между <BODY> и </BODY>, чтобы добавить в тело вашего документа.

  9. Добавьте заголовок:

    <H3>Here's the big picture</H3>

  10. Добавьте изображение, используя файл .gif, сохраненный в том же каталоге, что и страница:

    <IMG src="yourfile.gif">

  11. Добавьте список:

    <UL>Make me an unordered list.
<LI>One programmer</LI>
<LI>Ten SDKs</LI>
<LI>Great Internet Apps</LI>
</UL>

  12. Чтобы указать список вместо этого, используйте парные <теги OL> и </OL> вместо <тегов UL> и </UL> .

Этого должно быть достаточно, чтобы вы начали. Если на веб-странице отображается отличная функция, вы можете узнать, как она была создана, проверив источник HTML. Редакторы HTML, такие как Веб-страница Майкрософт, можно использовать для создания простых и расширенных страниц.

Вот весь HTML-источник для файла, который вы создали:

<HTML>
<HEAD>
<TITLE>Top HTML Tags</TITLE>
</HEAD>
<BODY>
HTML is swell.<BR>
Life is good.
<H3>Here's the big picture</H3>
<IMG src="yourfile.gif">
<UL>Make me an unordered list.
<LI>One programmer</LI>
<LI>Ten SDKs</LI>
<LI>Great Internet Apps</LI>
</UL>
</BODY>
</HTML>

Полное описание тегов, атрибутов и расширений см. в спецификации языка разметки гипертекста (HTML):

Последняя опубликованная версия HTML на W3C.org.

См. также

Основы интернет-программирования MFC