2.1 Въведение в таговете
HTML-documentsМаркирането се основава на етикети . Какво е етикет ?
Етикетите са изобретени още през 70-те години, за да могат хората да добавят служебна информация към documentи за програми, които обработват тези documentи.
Tag- това е ключова (функционална) дума, най-често на английски, която беше оградена в ъглови скоби (повече и по-малко знаци), така че програмите да не бъркат тагове и обикновени думи на английски.
Етикетът може също да съдържа различна служебна информация, която може да бъде полезна за програмата, която обработва documentа.
Примерен текст с етикет:
<a href="http://codegym.cc/about">
Link to something interesting
</a>В този пример виждаме текста, тага "a", Howто и служебна информация - атрибутите на тага. По-долу ще научите повече за тях.
2.2 Видове етикети: отварящ, затварящ, празен етикет
Етикетите са различни видове. Първо, те са единични и двойни. Най-често срещаните са сдвоените етикети . И Howто вероятно вече се досещате, те винаги вървят по двойки. Те се наричат още отварящи и затварящи.
Отварящият таг е просто ключова дума в триъгълни скоби. Пример:
<h1>Затварящият таг е подобен на отварящия таг, но ключовата дума се предхожда от наклонена черта. Пример:
</h1>Отварящият таг може да съдържа служебна информация - атрибути, затварящият - не . Началният етикет винаги е първият от двойка. Затварящият таг НЕ може да бъде първи в текста и след това отварящият таг. Това HTML-documentняма да е валидно.
Единичните етикети нямат затварящ етикет. Списъкът с такива етикети се определя от HTML-standard. Примери за такива тагове:
<br>- нов ред;<img>- картина.
Между другото, сдвоен етикет, ако не съдържа информация вътре, може да бъде написан в съкратена форма . Пример:
<h1/>Това не е единичен таг, а празен двоен таг. Това е като затворени и отворени етикети едновременно. Различава се от затворения таг по това, че наклонената черта е в края (преди втората триъгълна скоба).
2.3 Дърво на етикети
И още важна информация за сдвоените тагове. В един document може да има много от тях и те могат да бъдат вложени. Какво означава? Това означава, че всеки текст в рамките HTML-documentможе да бъде рамкиран (обвит) с тагове, дори ако съдържа други тагове. Пример:
<html>
plain text
<a href="http://codegym.cc/about">
Link to something interesting
</a>
some other text
</html>Грубо казано, последователност от тагове може да се появи в html текста:
<h1> <h2> </h2> </h1>Но не може да бъде:
<h1> <h2> </h1> </h2>Ако началният таг <h2>е вътре в <h1>двойка -tag, тогава съответстващият му краен таг </h2>също трябва да бъде вътре в <h1>двойка -tag.
По този начин всички тагове на documentи образуват вид дърво на таговете . Първо идва тагът от най-високо ниво, който обвива целия document, обикновено се нарича <html>, има двойки дъщерни тагове, те имат свои собствени и т.н.
Всъщност програмата, която обработва document с тагове, го вижда точно така - като дърво на тагове с няHowъв текст вътре.
2.4 Атрибути
Информацията за етикетите не би била пълна, ако не говорим за атрибути. Единичните тагове и началните тагове на сдвоените тагове могат да имат . Тези атрибути съдържат полезна информация за съдържанието на етикета.
Един таг може да съдържа няколко атрибута и те имат следната обща форма:
<tag name1="value1" name2="value2">Всеки атрибут е определен като двойка от Nameи meaning. Може да има произволен брой атрибути.
«<»Но опитен програмист веднага ще зададе въпроса: Howво да направите, ако трябва да използвате текст, съдържащ знаци or «>»кавички като стойност на атрибут ?
| Име на символ | Символ | HTML запис |
|---|---|---|
| двойна кавичка | " | " |
| амперсанд | и | и |
| По-малко от символ | < | < |
| Още символ | > | > |
| пространство | ||
| единичен цитат | ' | ' |