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


Основы HTML

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

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

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

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

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

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

    <HTML>
    <HEAD>
    <TITLE>Top HTML Tags</TITLE>
    </HEAD>
    </HTML>
    
  4. В меню "Файл" выберите "Сохранить" и сохраните файл как c:\веб-страницы\First.htm. Оставьте файл открытым в редакторе.

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

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

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

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

    <BODY>
        HTML is swell.
        Life is good.
    </BODY>
    
  7. В меню Файл выберите команду Сохранить .

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

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

    Для всех описанных ниже действий вставьте текст в любом месте между <ТЕКСТом и </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