Структура на HTML документа


 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

- указва типа на документа и версията на HTML

<html lang="bg">                    - указва начало на HTML файл

<head>маркери</head>                - съдържа описателна информация, обща за цялата страница

  <meta content="text/html; charset=windows-1251"

        http-equiv="content-type">  - указва кодовата таблица, в случая windows-1251, стандартната за страници на български език

  <title>Заглавие</title>           - указва заглавие, извеждано в лентата на браузера

  <meta name="author"

        content="Автор">            - указва автора на страницата

  <meta name="description"

        content="Описание">         - кратко описание (до 150 символа) на съдържанието на страницата

  <meta name="keywords"

        content="ключови думи">     - списък на ключовите думи, имащи отношение към съдържанието на страницата и описващи я най-добре (важен за търсещите машини)

  <meta http-equiv="content-language"

        content="bg">               - указва езика, на който е написан HTML документа (важен за търсещите машини)

<body>текст и маркери</body>        - указва същинската част на страницата, която се визуализира в браузера

      background="URL"              - изображение, което ще се ползва за фон

      bgcolor="цвят"                - цвят на фона на страницата

      text="цвят"                   - цвят на текста на страницата

      link="цвят"                   - цвят на връзките

      alink="цвят"                  - цвят на връзката, върху която е курсора

      vlink="цвят"                  - цвят на посетените връзки

</html>                             - указва край на HTML файл

 

Структуриране на текста

 

<h1>Заглавие</h1>                   - заглавия от 1-во ниво. Текста се извежда с по-голям шрифт, удебелен, и се оставя по 1 празен ред преди и след заглавието

<h6>Заглавие</h6>                   - заглавия от 6-то ниво. Текста се извежда с по-малък шрифт, удебелен, и се оставя по 1 празен ред преди и след заглавието

<p>Текст</p>                        - отделя текста в отделен параграф. Оставя по 1 празен ред преди и след параграфа.

   align="left"                     - ляво подравняване

         "right"                    - дясно подравняване

         "center"                   - центриран текст

         "justify"                  - двустранно подравняване

<br>                                - добавя нов ред

    clear="all"                     - край на обтичане на изображения

          "left"                    - край на обтичане на изображения отляво

          "right"                   - край на обтичане на изображения отдясно

<div>Текст</div>                    - общ контейнер за текст и обекти. Използва се за подравняване и за стилове. Не оставя празен ред преди и след параграфа. Ако няма затварящ маркер, действието му е като на <br>

<blockquote>Текст</blockquote>      - вмъкване на текста навътре

<nobr>текст</nobr>                  - забранява прекъсването на текста и пренасянето му на по-долен ред

<pre>текст</pre>                    - преформатиран текст (например за програмен код) - извежда се така както е изписан в редактора, с всички интервали и нови редове

<xmp>HTML код</xmp>                 - за HTML код - извежда се така както е изписан в редактора, с ъгловите скоби около маркерите, с всички интервали и нови редове

<address>адрес</address>            - адрес (не електронен, а например пощенски адрес) - обикновено се извежда наклонен

<cite>цитат</cite>                  - за вмъкване на цитати - обикновено се извежда наклонен

<hr>                                - изобразява хоризонтална линия

    width="число или процент%"      - широчина на линията в пиксели или в процент от широчината на екрана

    size="пиксели"                  - дебелина на линията в пиксели

    align="left"                    - ляво подравняване

          "right"                   - дясно подравняване

          "center"                  - линията е в средата

    noshade                         - ако искаме линията да няма сянка

    color="цвят"                    - цвят на линията, но не е гарантирано че ще се поддържа от всички браузери

<!--Коментар-->                     - указва коментар, който не се изобразява в браузера

   

Форматиране на текста

 

<font face="шрифт">текст</font>     - указва изобразяване на текста с указания шрифт. Указват се един или няколко шрифта, разделени със запетая   

      size="размер"                 - указва размера на шрифта

           "1"                      - най-малък текст

           "7"                      - най-голям текст

           "+1"                     - малко по-голям от стандартния размер

           "-1"                     - малко по-малък от стандартния размер   

      color="цвят"                  - задава цвят на текста

<big>текст</big>                    - текст малко по-голям от текущия размер <font size="+1">

<small>текст</small>                - текст малко по-малък от текущия размер <font size="-1">

<i>                                    - за курсивен (наклонен) текст

<u> или <ins>                          - за подчертан текст

<strike> или <s> или <del>             - за зачертан текст

<sup>                                  - горен индекс

<sub>                                  - долен индекс

<dfn>                                  - за дефиниции. Извежда се с курсивен текст

<var>                                  - за указване на променливи в текста. Извежда се с курсивен текст

<tt>                                   - изписва текста с шрифт с фиксирана широчина (Courier)

<code> или <samp>                      - за програмен код. Използва шрифт с фиксирана широчина

<kbd>                                  - за въвежданото от клавиатурата. Изписва текста в шрифт с фиксирана широчина

<acronym>съкращение</acronym>          - за изписване съответно на акроними

        title=”текст”              - пълното название на съкращението

<abbr>съкращение</abbr>                - за изписване на абревиатури

        title=”текст”               - пълното название на съкращението

 

Добавяне на изображения

 

<img src="URL">                     - извеждане на изображение, намиращо се на адрес URL

     alt="Алт.текст"                - текст, извеждан преди да се зареди изображението или вместо него

     title="Подсказка"              - подсказка извеждана когато курсора е върху изображението

     height="пиксели"               - височина на изображението в пиксели

     width="пиксели"                - широчина на изображението в пиксели

     align="top"                    - подравняване по горния край на първия ред от текста

           "middle"                 - подравняване по средата на първия ред от текста

           "bottom"                 - подравняване по долния край на първия ред от текста

           "left"                   - изображението е вляво, а текста го облива отдясно

           "right"                  - изображението е вдясно, а текста го облива отляво

     border="пиксели"               - размер на рамката около изображението в пиксели

     hspace="пиксели"               - разстояние между изображ. и текста в хоризонтална посока

     vspace="пиксели"               - разстояние между изображ. и текста във вертикална посока

 

Добавяне на препратки

 

<a href="URL">подчертан текст</a>   - указване на препратка към страница URL

   target="_blank"                  - отваряне на препратката в нов прозорец

          "име"                     - отваряне на множество препратки в един и същ прозорец

<a name="котва">текст</a>           - указване на котва (място към което ще сочат други препратки)

 target="_blank"

<a href="#котва">текст</a>          - препратка към друго място в същата страница

<a href="URL#котва">текст</a>       - препратка към определено място в друга страница

<a href="mailto:email">текст</a>    - препратка стартираща програма за електронна поща