Tag ( pl. tags, sometimes tag) is an element of the HTML language that is used to mark up the source text of a web page. Tags are abbreviations or abbreviations of English words enclosed in angle brackets, for example, tag
…
abbreviation for English word paragraph, that is, the text enclosed in this tag will be recognized by browsers as a paragraph.Each tag in HTML has a special meaning and is responsible for displaying certain data. The case of letters in tag names does not matter, for example, tag
…
and tag…
- It is the same. That is, tags can be written in both lowercase and capital letters. Previously, it was common practice to write all tags in capital letters so that the tags differed from ordinary text. Now there is no such need, since many editors have syntax highlighting. Tag classificationThere are more than 90 tags in HTML. Typically, one tag affects only part of the document, for example, the first-level heading tag... In such cases, paired tags are used: opening And closing. An opening tag (for example, ) creates the effect, and a closing tag ( ) stops the effect. As you can see from the example, the closing tag always has this symbol (/) - a forward slash. These tags are called doubles.
Some tags provide a one-time effect where they appear. For example, a horizontal bar tag or an image display tag . Such tags do not have closing tags. Such tags are called non-paired.
Tag typesIn addition, tags are divided into several types, which differ in their functions:
- document title tags;
- block elements;
- inline elements;
- universal elements;
- lists;
- tables;
- frames.
This division is not strict, so some tags are in different groups. For example, tags for creating lists and
- apply to both lists and block elements. Tag structure
- Your own webmaster
- empty elements - , ,
, , , , , , , , , , , , ; - elements with unformatted text - , ;
- elements that display unformatted text - , ;
- elements from another namespace - MathML and SVG;
- ordinary elements - all other elements.
- The element begins with an opening tag.
- The element ends with a closing tag.
- The content of an element is everything between the opening and closing tags. The content can be text and/or other HTML elements.
- The element consists only of an opening tag.
When loaded in the browser, the tags themselves are not displayed, but they do affect the way their content is displayed. If a tag is misspelled, it is ignored entirely.
All tags have a certain structure that must be followed when writing. Additionally, almost all tags have various attributes that can change the way the content is displayed.
Let's look at the correct structure of tags containing attributes:
As an example, I gave two completely different tags. First single - responsible for displaying images, attribute - src="logo.jpg" . Second … the paired one is responsible for creating links, the attribute is href = "site" .
Conclusion 1: Attributes can have paired and unpaired tags.
Conclusion 2: Only opening tags can have attributes, closing tags do not have attributes.
Picture for clarification:
Figure 1. HTML tag structure
Test of attentiveness and knowledge of HTML syntaxLet's look at the example of a simple web page that we looked at in the lesson.
You've already read that all language is made up of tags. In this lesson we will take a closer look at HTML tags. In the HTML language, tags are divided into single (not paired) and paired tags. So, single HTML tags consist of one tag, that is, they do not have a closing tag. And paired descriptors have an opening and closing tag.
Single HTML tagsSingle tags do not have a closing tag. For example:
, . Previously they wrote like this:
, , now this style of writing single tags is not relevant, so don’t write like that. The most used single tags:
- move to a new line, - dividing line, - insert an image.
There are many more paired tags. A paired descriptor has an opening and closing tag. The paired tag forms a container. The content of the container is what is between the opening and closing tags. In the example from this article, you saw the tag What are descriptors in HTML? , so this is a paired tag, the content of this tag is the text “What are tags in HTML?” Its beginning is the tag and its end is .
The main mistake of beginners in writing paired tags is confusion in nesting. For example, this is the correct entry:
Bold paragraph
. And here's the error:Bold paragraph
, an HTML document with such a layout is considered invalid. In order not to confuse nesting, do this: create paired tags, then nest others in them, and at the end write the text inside both tagsHow to write paired tags correctly
. What's new in HTML5 in terms of tags?HTML5 is an extension of HTML4, so it retains most or all of the descriptors from HTML4 and adds its own. HTML5 introduced special tags for dividing the site into main blocks: header, menu, footer, sidebar and content.
Why is it important to learn how to use tags?Search engines Yandex and Google are sensitive to layout HTML documents, checking them for validity. They look for keywords enclosed in special descriptors and so on. But this section is not about that. This applies to promotion (SEO).
How to learn all HTML tags?Yes, there are quite a few tags. But there is no need to specially teach them. As long as you practice writing something, all the descriptors, paired and single, will be easily remembered. Over time, of course.
HTML tags are the basis of the HTML language. Tags are used to delimit the beginning and end of elements in markup.
Each HTML document consists of a tree of HTML elements and text. Each HTML element is identified by a start (opening) and ending (closing) tag. The opening and closing tags contain the name of the tag.
All HTML elements are divided into five types:
The table shows full list elements supported by HTML4 and HTML5. Experimental and legacy tags are excluded. Elements added to the HTML5 specification are highlighted in teal.
Complete list of HTML elementsUsed to add comments. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Declares the document type and provides basic information to the browser - its language and version. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Creates hypertext links. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Identifies text as an abbreviation or acronym. Explanatory text is specified using the title attribute. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Specifies the contact information of the author/owner of the document or article. Displayed in italics in the browser. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
It is a hyperlink with text corresponding to a specific area on an image map or an active area within an image map. Always nested inside a tag. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
A section of content that forms an independent part of a document or website, such as a magazine article, blog post, comment. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Represents page content that is indirectly related to the main content of the page/site. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Loads audio content into a web page. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Sets a passage of text to be bold without adding emphasis or importance to the highlighted text. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Specifies the base address (URL) from which all relative addresses are calculated. This will help avoid problems when moving the page to another location, since all links will work as before. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Isolates a passage of text written in a language in which the text is read from right to left from the rest of the text. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Displays text in the direction specified by the dir attribute, overriding the current text direction. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Highlights text as a quote, used to describe large quotes. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Represents the body of the document (content that is not part of the document's metadata). | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Wrap text to a new line. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Creates an interactive button. You can place content inside the tag - text or image. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Canvas container for dynamically displaying images such as simple images, charts, graphs, etc. The JavaScript scripting language is used for drawing. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Adds a caption to the table. Inserted immediately after the tag
|