Basics of html and css. HTML Language for Beginners
Hi all!!! I'm very glad that you decided to conquer the heights of HTML basics and this right choice. After all, before creating your first website, you need to know the basics of HTML. Moreover, you will have to deal with HTML coding on a website more than once. I highly recommend checking out the HTML tutorials for beginners on my blog, and I guarantee that after completing this course, you will be able to create a web page or even a website yourself with ease.
Let's get started! First, let's find out
HTML – (from English. H ypert ext M arkup L anguage) is a hypertext markup language. It was first developed by British scientist Tim Berners-Lee in 1991-1992. HTML was only intended to mark up text, pictures, and tables on web pages. Now programming languages such as JavaScript and VBScript can also be inserted into an HTML document.
HTML is not a programming language; it is intended only for marking up text documents.
To learn HTML, you just need to have a Browser and Standard Notepad or .
To open Standard Notepad, do the following on your computer: “Start” => “Programs” => “Accessories” => “Notepad”
.
If you've heard about programs that make your work easier writing HTML code ( Microsoft FrontPage, Adobe Dreamweaver), then I do not recommend using them on at this stage training. Write your hand in a standard notebook or in text editor Notepad++, and when you complete this course, you will be able to use programs for acceleration. Subscribe to my blog updates and read how to use Microsoft programs FrontPage, Adobe Dreamweaver.
For better understanding, I have prepared an example. Look carefully at the picture:
Explanation.
1). Any HTML document begins with this line:
With this line we tell the browser that our HTML document complies with the international specification version 4.01. Thanks to this line, your page will look the same.
It is not necessary to remember this line; the HTML document will work without it. This is just so you are aware of what it is.
2). and is the beginning and end of the document.
3). and - the head of the document. Additional service tags are often inserted here; one of these tags is . You will learn about other service tags in further lessons; at this stage of training, this information is enough.
4). and - document title.
This header will be displayed in the browser:
in search I am index or in Google.
5). and - the body of the document.
Here is the content of the document, for example, text, pictures, tables, music, movies, etc. You will learn more about how to insert music, text, pictures into the body of the document in the following lessons.
Note:
You will often read and hear the word “tag”.
A tag is everything that is between the brackets< >. For example:
,
,
,
,
,
etc. - all these are tags.
Tags are not visible when viewing the page in a browser, but everything that is not in brackets will be displayed in the browser when viewing.
There are many tags and they have different purposes.
There are tags that need to be closed. For example,
open the tag
and be sure to close the tag
And there are single tags, for example, this one
.
A tag is a kind of container that can contain text, pictures and other tags...
○ Pay attention to the correct sequence of opening and closing tags:
...
The tag that we opened first is closed last, the second one is penultimate, etc.
○ Here is an example of an incorrect sequence of opening and closing tags. With this order, there may be errors on the web page:
...
The error was in and.
Be careful when writing code.
Ready code.
This is what the finished standard mandatory HTML code for a web page looks like.
Page title Page text, tables, pictures, music and video.
Do not be discouraged if you understand little or almost nothing from everything written above. In the second lesson there will be more practice, and you will be able to manually write everything yourself and see how HTML works.
Continue to the next lesson
HTML is the hypertext markup language that made the Internet what we know and love. It is thanks to this wonderful tool that sites look beautiful and modern, and also ensure ease of use. HTML simply arranges the elements of a web page into a user-friendly format. Its work is comparable to what people like MS Word or OpenOffice do. They turn a faceless mass of letters into a document containing paragraphs, bold text, italics, tables and even images. The HTML language does approximately the same thing, with the only difference being that its documents are displayed in the browser, and the capabilities of this tool are much wider than those of a text editor. Tags are used for markup - special teams, describing the structure of a web page. They are enclosed in angle brackets - so that the browser can distinguish them from the bulk of the text. Next, we'll cover the basics of HTML for beginners.
Visual editorsBeginners who have just set out on the path to learning HTML often start their work with programs that allow you to create websites without any knowledge. In them you can simply arrange elements on the screen the way they will be displayed in the browser. It would seem that this is the source of eternal grace that allows you to get rid of the majority of web developers. But not everything is so simple, since visual editors have a lot of shortcomings that make it impossible to use them in serious projects.
All of these programs create a lot of unnecessary tags that make the final page unwieldy and suboptimal. Of course, in our age high-speed Internet This matters less than it used to, but there are a number of reasons why a concise and well-written website is more practical than its counterpart created in a visual editor. A web page made in such a program will not be processed well search robots, since every kilobyte of code is important to them, and cumbersome and illogical code with a bunch is unlikely to suit their taste. In addition, editors often lag behind the times, becoming irrelevant, and spending resources on their development is impractical, since no professional uses these products. Therefore, anyone who wants to work in the website development industry must know the basics of HTML.
TagsAs mentioned above, tags describe the structure of a web page to the browser. Most of them have an opening and closing tag, but not all. For example, ..., where instead of dots there is content. The first one shows where the tag starts, and the second one closes it. There may be other page markup elements inside; they can be nested inside each other like a nesting doll. It is important to close tags in a timely manner so that the page is displayed correctly.
There are also single tags that do not need to be closed. In them, the content is located inside, just as it can be written for most HTML tags, and sets the properties of the element. It is indicated in the opening tag and looks something like this: attribute="...", where instead of dots there is the attribute value. Knowing tags is the first and most important step to master HTML. The basics of this art also involve understanding the structure of a web page.
Document structureEvery HTML document has a corresponding extension, for example Index.html. This way the browser can understand what it is dealing with and display the page correctly. It is advisable to store all files used to create a website in one directory, which will make your life much easier in the future. The basics of the hypertext markup language HTML require a clear understanding of document structure. It starts with a tag that tells the browser HTML version, which is used in this document. On at the moment The fifth version of the language is current, so there is no need to invent anything here; you can safely insert the above tag at the beginning of any page.
Then there are the main paired structures that make up the “skeleton” of the site. The first tag, in which all the others are nested, is .... Anything outside of it is not recognized by the browser as a web page, so it opens the document and closes it. This tag is required for any document. It also contains several more required tags, which will be discussed below.
HeadInside the ... tag is technical information that will not appear on the page, but is nonetheless an important part of the HTML document. The foundations of the site are laid in this place; here the encoding is selected and the page name is entered. It is contained inside a required tag.... The title is displayed at the top of the browser, where you can also place a small icon that characterizes the contents of the page. It is advisable to immediately indicate the encoding of the document for its correct display. This can be done using the tag. Meta tags provide information about the structure of the page and are usually located inside the head.
LinkKnowing the basics of HTML also involves using cascading styling, or css. They set the properties of the elements that will be displayed on the page. A modern approach to this task involves placing characteristics such as color, height and location of the element into external file for greater convenience. To include a css file, use the tag. In its finished form, it looks something like this: where href indicates the location of the file, and type indicates its type.
BodyIt is in this part of the HTML document that the visible part pages. Everything that is done inside the "body" will be shown by the browser. In used huge amount HTML tags. The basics are text formatting, working with links, and basic tools for structuring a web page. To get started working in HTML, you just need to know the basic tags and be able to use them. Below are the most popular ones:
- - used to highlight a substring that will be subject to a special style described in css;
- - creates a link on a web page; the transition address is specified by the href attribute;
- - one of the most popular tags of our time; anyone who decides to learn the basics of the HTMLl language should pay special attention to it, since this is a block element, on the basis of which the lion's share of modern sites is made (parameters for blocks are set in css, and other blocks can be located inside this tag);
Selects a paragraph from the text; the content of the paragraph is between the opening and closing tags;
- - a numbered list whose elements are enclosed in a paired tag
- - a bulleted list, in which, just like in a numbered list, elements are designated by a tag
- - - document headings (the number indicates the heading level, that is, the main heading, and subsequent options are its subheadings; by the way, level headings are almost impossible to find on the Internet), it is also important to remember that there can only be one heading on a page;
- - bold text;
- - italics;
- - inserting a picture onto a website (this is a single tag, it does not require a closing tag, but it must include the alt attribute, which specifies the text for the image);
- - inserting video into a web page;
- - a tag that inserts an audio file into the document.
These are not all the tags you need to create your own web page, but they are enough to lay the basics of HTML for beginners.
CSSThe development of the HTML language has led to the fact that each tag has acquired a lot of attributes, and the requirements for the appearance of web pages have increased significantly. The code became cumbersome and inconvenient, it was difficult to read it, let alone adapt or change it. In addition, if your site has ten pages with a lot of headings marked in green, and you suddenly want to make them red, you will have to work hard, changing each one manually. With the advent of Cascading Style Sheets, this process has become simple and logical, and the HTML code has become much more readable.
Applying CSSTo create web pages, you need to know the basics of HTML and CSS, since now there is nothing to do in this area without knowledge of cascading style sheets. They set attributes for any element that apply to the entire document. This way you can set the color for all elements at once
In order to connect a css file to a document, there is a link tag. The principle of its use was described a little higher, but it is not the only option for combining all styles in one place. There is also a tag, which is located in the “head” of the document and allows you to write styles without using CSS files. It is not necessary to use one method or the other. They can be successfully combined to obtain the best result. To create a file with style sheets, you need to create a file with a .css extension, for example, Styles.css.
JavaScriptOften, a person who decides to start realizing that the tools that HTML offers are not enough for his tasks. The basics will allow you to create a beautiful page, but what if you suddenly need to make it interactive? For these purposes, there is a unique programming that interacts perfectly with HTML. It is called JavaScript, as it was conceived as the younger brother of the popular Java language. Today, these languages have acquired significant differences, and the gap between them is only growing.
JavaScript can extend the capabilities of HTML by allowing you to create and edit tags. Also, using this wonderful tool, you can work with Cokie, download data from the server without reloading the page, and make the site more interactive than HTML capabilities allow. This language also has limitations related to security. If JavaScript is not used on the server side, it will be executed under conditions that limit its capabilities, so that attackers cannot use malicious code on any computer.
EditorsHTML basics for a beginner require knowledge of the most convenient and practical programs for creating web pages. As written above, visual editors such as Dreamweaver and the like are not suitable for these purposes. So, should you write tags in a regular notepad? This option is also questionable, since a standard notepad does not have any special layout tools. Notepad++ can handle this task quite well. The big advantage of this product is that it is open source and distributed absolutely free. It has convenient syntax highlighting and automatic closing of tags. Notepad++ also provides a wide selection of interface languages, and its capabilities are easily expanded with numerous add-ons.
Sublime Text 3 is a program similar to Notepad++, but available for a fee. It was she who won the hearts of most developers. Sublime Text 3 is perfect for JavaScript, CSS and HTML. You'll have to learn the basics of working with it yourself, but it's worth it. It contains truly limitless possibilities for fine-tuning, which allows you to tailor the program to your needs as much as possible.
HTML and CSS Basics for BeginnersAs you can see, learning the art of creating web pages is not as difficult as it seems at first glance. Just a few months of practice will transform you from a timid user to a novice developer. Learning layout is much easier than mastering a programming language or Linux. In fact, there are not so many HTML tags; it is important to understand the practical aspect of their use.
Skill in working in Adobe Photoshop will not be superfluous in this matter. This program allows you to work with photographs, pictures and other graphic elements of a web page. At the moment, it is Photoshop that best copes with such tasks; it has few competitors. For those who do not like this Adobe product, there is Lightroom, GIMP, Illustrator and other programs with similar functions.
What does knowledge of HTML give?Web page creation skills are very relevant today, as the Internet is expanding by leaps and bounds. Every enterprise, even the smallest store, workshops and sports clubs - everyone wants to have their own website. And of course, for this they will need a developer who knows CSS and HTML. The basics are easy to master, after which it's a matter of practice. Since layout technologies are constantly evolving, front-end developers will always be in demand. Anyone who decides to devote himself to this interesting industry will never be left without work.
HTML stands for H yper T ext M arkup L anguage, i.e. Hypertext Markup Language is the basic building block of web pages, used to create and visually present web pages.
HTML adds markup to plain text. Hypertext contains various links through which web pages are connected to each other. With HTML, anyone can create both static and dynamic websites. HTML is a language that describes the structure and semantics of the content of a web document. The content of a web page is marked up using tags, which represent HTML elements. Examples of such elements are, , and so on. These elements form the building blocks for any website.
HTML was invented in 1991 by scientist Tim Berners-Lee, and was originally intended for the exchange of documents between scientists at different universities. With his invention, Tim Burns-Lee laid the foundations of the modern Internet.
There are several versions of HTML. The language standard is continuously updated and supplemented, and as a result, a new version of HTML is released almost every year. Version "HTML 2.0" was the first standard HTML specification, which was published in 1995. HTML 4.01 is the major version of HTML that was published in late 1999 and is widely used today. Today, the most popular version is HTML-5, which is an extension of HTML 4.01, published in 2012.
An HTML document or web page is a simple text document containing tags (which in turn are plain text enclosed in angle brackets). A web page can be typed either in a regular text editor (Notepad, WordPad, Word, etc.) or in a specialized one with code highlighting (Notepad++, Sublime Text, etc.). HTML documents are stored as files with the extension .htm or .html.
Online examples in every lessonAs we present the material, each lesson will provide examples that will help you understand each code in detail and, through practice, enjoy learning. With our online HTML editor, you can edit an HTML document, and then click the orange "Run" button in the editor, which is located above the left editor window, to see the result. If you use a specialized HTML editor, then you can copy the example and view the results of your work in the browser installed on your computer.
Example HTML: Try it yourself
Page title
This is the title
This is a paragraph.
Online HTML examplesThe HTML tutorial provides you with more than 100 online examples that will help you easily master the markup language. It's better to see once than to hear a hundred times! Theory plus practice is the key to your success in mastering HTML.
Welcome to the pages of my blog. HTML is a simple markup language that is used to create web pages. I said it was simple so you wouldn't be intimidated by learning it. The html language is simply ideal for beginners - it is much more difficult to immediately master a programming language from scratch, but html is actually much simpler.
In this article, I want to tell you how to learn this language most quickly and effectively, so that within a month or two you know it perfectly. Do you think it's impossible? I started learning html at the end of March. At the end of May, I already knew 90% of the tags needed for work without any problems.
How to learn a language for free?Of course, for the fastest learning, you should find several useful sites. Firstly, you will need html reference. Even seasoned programmers use it, because it is simply impossible to keep dozens of tags and their attributes in your head.
From the reference books I can recommend to you - htmlbook. This is a really cool site that collects all the tags and shows the result of their work with detailed description. But this is just a guide additional tool, the greatest effect can be achieved with real practice.
Interactive coursesAnd here I’m talking about interactive courses. This is the ability to write code and immediately see how it is displayed. During the courses you will be given assignments. First, simple ones, for example, turning the text into a title or making a table. Then it’s more difficult. Eventually you will gain an understanding of what you can do with using HTML. If you think that you have to pay for this, you are mistaken.
is a wonderful site with courses on html and css. The first 16-18 courses are free! If you want to continue your studies and gain access to paid ones, you will have to pay 300 rubles per month or 1800 per year. Personally, I gave 300 rubles, I completed everything in a month paid courses and got a lot of benefit from it.
Importance of recordsAnother piece of advice from me – write it down! Write down all information that is new and important to you. Without writing it down, you risk not retaining the necessary knowledge in your memory. Personally, I have three general notebooks on my shelf, almost completely filled with writing, and from time to time I look at them when I forget this or that property.
Parallel study of html and cssHTML is just one web technology that helps create the structure and layout of a web page. CSS is entirely responsible for design in website development. These languages need to be learned simultaneously because they interact with each other.
Independent practiceOnce you have gained some knowledge, you can practice on your own. How to do this? Try laying out an article with pictures, a table, a nested list, a simple two-column page layout, or something else. You have to practice because that's the only way to quickly ingrain in your brain an understanding of how things work. The best thing, of course, is to find yourself a teacher in this matter, but most likely you will have to pay for this.
Lessons from the webformyself teamWebformyself is a wonderful Internet portal that provides a ton of information on website building. You can find a lot on their website free articles on HTML, CSS and website layout, but they also released paid video tutorials, the purpose of which is to convey useful knowledge to you as quickly as possible.
At the end of the day, you should have a reason why you are learning these web technologies. This is usually done in order to learn how to create website layouts yourself. If you also have this goal, then an excellent option for you would be to purchase access to premium lessons on webformyself.com. As a result, you can get not only access to lessons on HTML and CSS, but also many others. For example, JavaScript and WordPress.
There is useful lessons, I would also like to note the opportunity to make up my first layout using lessons. This is very important because you will receive good practice, after which you will be able to get better at it yourself, trying to create other layouts for sites that you find on the Internet.
How long does it take to learn languages?On average, HTML and CSS can be learned very quickly, with the right approach. For example, it took me several months. If you know where to get knowledge, the learning process can be speeded up several times.
Good sites with useful materials I gave it to you - then it’s up to you. In principle, the above resources are the best on the Internet. For example, more than one hundred thousand people have completed courses from Htmlacademy, and more than 87 thousand people have subscribed to Webformyself updates.
HTML Basics contains the basic rules HTML language, description of the structure of an HTML page, relationships in the structure of an HTML document between HTML elements.
An HTML document is a regular one text document, can be created both in a regular text editor (Notepad) and in a specialized one with code highlighting (Notepad++, Visual Studio Code, etc.) . An HTML document has a .html extension.
An HTML document consists of a tree of HTML elements and text. Each element is identified in the source document by a start (opening) and an ending (closing) tag (with rare exceptions).
The start tag shows where the element begins, the end tag shows where it ends. The closing tag is formed by adding a slash / before the tag name: .... Between the start and closing tags is the content of the tag - the content.
Single tags cannot store content directly; it is written as an attribute value, for example, a tag will create a button with the text Button inside.
Tags can be nested inside each other, for example,
Text
. When investing, you should follow the order in which they are closed (the “matryoshka” principle), for example, the following entry will be incorrect:Text
.HTML elements can have attributes (global, applied to all HTML elements, and their own). Attributes are written in the opening tag of the element and contain a name and value, specified in the format attribute name="value" . Attributes allow you to change the properties and behavior of the element for which they are set.
Each element can be assigned multiple class values and only one id value. Multiple class values are written separated by a space, . The class and id values must consist only of letters, numbers, hyphens and underscores and must begin with letters or numbers only.
The browser views (interprets) the HTML document, building its structure (DOM) and displaying it in accordance with the instructions included in this file (style sheets, scripts). If the markup is correct, the browser window will display an HTML page containing HTML elements - headers, tables, images, etc.
The interpretation process (parsing) begins before the web page is fully loaded into the browser. Browsers process HTML documents sequentially, from the beginning, while processing CSS and relating style sheets to page elements.
An HTML document consists of two sections - the header - between the tags ... and the content part - between the tags ....
Web page structure 1. HTML document structureHTML follows the rules contained in the document type declaration file (Document Type Definition, or DTD). A DTD is an XML document that defines which tags, attributes, and their values are valid for a particular HTML type. Each version of HTML has its own DTD.
DOCTYPE is responsible for the correct display of a web page by the browser. DOCTYPE specifies not only the HTML version (eg html) but also the corresponding DTD file on the Internet.
...
The elements inside the tag form a document tree, the so-called object model document, DOM (document object model). In this case, the element is the root element.
Rice. 1. The simplest structure web pagesTo understand the interaction of web page elements, it is necessary to consider the so-called “family relationships” between elements. Relationships between multiple nested elements are classified as parent, child, and sister.
An ancestor is an element that contains other elements. In Figure 1, the ancestor for all elements is . At the same time, the element is the ancestor of all the tags it contains: ,
. . . etc.
A descendant is an element located within one or more element types. For example, is a descendant of , and the element
Is a descendant of both and .
Parent element - an element that is related to other elements by more than one low level, and located on the tree above them. In Figure 1 and . Tag
Is parent only to .
Child element- an element directly subordinate to another element of a higher level. In Figure 1 there are only elements , ,
And are children of .
A sister element is an element that has a common parent element with the one in question, the so-called elements of the same level. In Figure 1 and are elements of the same level, as well as elements , and
They are sisters to each other.
1.1. Element 1.2. ElementSection ... contains technical information about the page: title, description, keywords for search engines, encoding, etc. The information you enter there is not displayed in the browser window, but it contains information that tells the browser how to process the page.
1.2.1. ElementThe required section tag is . The text placed inside this tag appears in the title bar of the web browser. The title should be no more than 60 characters long to fit completely in the title. The title text should contain as much as possible full description web page content.
1.2.2. ElementAn optional section tag is a single tag. With its help, you can set a description of the page content and keywords for search engines, the author of the HTML document, and other metadata properties. An element can contain multiple elements because they carry different information depending on the attributes used.
The description of the page content and keywords can be simultaneously specified in several languages, for example, in Russian and English:
Using a tag, you can block or allow indexing of a web page by search engines:
To automatically reload the page after a specified period of time, you need to use the refresh value:
The page will be reloaded after 30 seconds. To redirect the visitor to another page, you need to specify the URL in url parameter:
Table 2. Tag attributes
1.2.3. ElementAttribute charset Specifies the character encoding for the current HTML document: content Contains free text, which specifies the value associated with the http-equiv or name attribute, depending on their value. http-equiv Controls browser actions on a given web page (equivalent to HTTP headers). When rendering the page, the browser will follow the instructions specified in the attribute:
default-style specifies the preferred style to use on the page. The content attribute must contain the ID of the element that references the table CSS styles, or the identifier of the element containing the style sheet.
refresh indicates the time in seconds before the page is reloaded or the time before redirecting to another page if the content attribute contains the line "url=page_address" after the time.
Automatic reboot pages after a specified period of time, in in this example, after 30 seconds:
If you need to immediately transfer the visitor to another page, you can specify the URL in the url parameter:
name Associated with the value contained in the content attribute. Should not be used if the element already has the http-equiv , charset , or itemprop attributes set.
application-name specifies the name of the web application used on the page.
author specifies the name of the document's author in free format.
description defines brief description to the page content, for example:
generator specifies one of the packages software, used to create a document, for example:
.
keywords contains a list keywords, separated by commas, corresponding to the page content, for example:
.
Also, the name attribute can take the following values from the extended specification, such as creator, googlebot, publisher, robots, slurp, viewport, although none of these have been officially adopted yet.Inside this element, styles that are used on the page are set. CSS is used to set styles in an HTML document. There may be several such elements on a page.
Inside this element you can write formatting code for both the web page elements themselves and the entire web page.
.paper ( width: 200px; height: 300px; background-color: #ef4444; color: #666666; )
To connect a specified style to an element, you need to assign the appropriate name to the element using the class (or id) attribute:
...
CSS code can be embedded directly into the markup element as the value of the style attribute, for example:
1.2.4. Element
You can also set styles for a document using another method - write them in separate file with a .css extension, for example style.css .
There are two ways to connect a file with styles to a web page:
via the @import url directive@import url(style.css);
using the element. The element does not require a closing tag. This item defines the relationship between current page and other documents. There may be several such elements on a page. The entry will look like this:
Table 4. Tag attributes
1.2.5. ElementAttribute Description, accepted value crossorigin Indicates whether CORS (a browser technology that allows a web page to access resources from another domain) should be used when retrieving an image from a site.
anonymous — the browser automatically adds an Origin header to a cross-domain request, containing the name of the domain from which the request was made. If the server does not respond with the CORS header Access-Control-Allow-Origin: * (or the domain name instead of an asterisk), then loading the image will be blocked.
use-credentials - If the server does not provide credentials using Access-Control-Allow-Credentials: true , then image loading will be blocked.href The main attribute of the tag, the value is the path to the file with styles. hreflang Determines the language of the text in the referenced document. media Specifies the type of device to which the link resource should be applied. nonce A randomly generated string variable on the server that sets rules for using inline styles to protect content. The attribute value is a text string. rel The attribute defines the relationship between the current document and the document being referenced.
alternate - a link to the same document, but in a different format (for example, pages for printing, translation, mirror, feed in RSS or Atom format),
.
archives - indicates that the linked document is of historical interest. A link may point to a collection of records, documents, or other materials.
author link to a page about the author of the document or to a page with the author’s contact information.
bookmark a reference to the article's closest ancestor that is the link, or to the section of the article most closely related to the element if there is no ancestor.
external is used to indicate that the page being linked to is not part of this site.
first specifies a link pointing to the first document in a sequence of documents.
help link to a help document.
icon specifies the path to the icon that will be used for the current document.
last indicates a link leading to last document in the sequence of documents.
license A link to the copyright information for a document.
next indicates that this document is part of a series and that the link goes to the next document in that series.
nofollow indicates that the link is not endorsed by the page's author or that the link is of a commercial nature.
noreferrer indicates that the client request header containing the url of the request source should not be passed when following the link.
pingback specifies the address of the pingback server, which allows the blog to automatically notify sites that link to it.
prefetch specifies that the referenced file should be cached in advance.
prev indicates that this document is part of a series and that the link is to a previous document in that series.
search indicates that the referenced document contains an interface for search and related resources.
sidebar indicates that the linked document will be shown in additional browser context, if possible, and some browsers, when you click a hyperlink, open a window to add the link to your bookmarks bar.
stylesheet is a link to an external file that will be used as a style sheet for this document.
tag indicates that the hyperlinked tag applies to this document.
up indicates that the page is part hierarchical structure, and that the hyperlink leads to more high level resource in the structure.sizes Specifies the size of icons for visual display. The sizes attribute is used only in conjunction with rel="icon" and can take the following values:
widths-height - defines a list of sizes separated by spaces, each size must be in the format - widths-height (icon dimensions are specified in pixels), for example:
;
any - the icon can be scaled to any size.title Defines the title of a link or the name of a set of alternative style sheets. The attribute value is text. type Specifies the MIME type of the document being referenced. IN in this case it takes the value "text/css" . Table 5. Tag attributes
1.3. ElementAttribute Description, accepted value async The attribute indicates that the script will run asynchronously with the rest of the page (the script will start executing at the same time the page loads). charset Defines character encoding crossorigin Determines whether CORS will be used when loading external scripts (using the src attribute).
anonymous - before loading the script into a cross-domain request, the browser automatically adds the Origin header, without passing access parameters (cookie, X.509 certificate, login/password for basic authentication via HTTP). If the server response does not contain the Access-Control-Allow-Origin: domain name header, the script will not be loaded.
use-credentials — before loading the script into a cross-domain request, the browser automatically adds an Origin header indicating access parameters (cookie, SSL certificate or login/password pairs). If the server response does not contain the Access-Control-Allow-Credentials: true header, the script will not be loaded.defer Interpretation of scripts is delayed until the document is rendered on the user's device. nonce Provides security by protecting against cross-site scripting attacks (XSS, cross site scripting). Sets rules for using built-in scripts using nonce values and hashes. During page rendering, the browser calculates hashes for each inline script and compares them with those listed in the CSP. Downloads from resources not included in the “white list” are blocked. src Indicates the location of the file with the script; the attribute value is the url of the file containing the JavaScript program. type Used to declare the script language used to compose the content of the tag. This section contains all the contents of the document. Available for the element.
Table 5. Tag attributes
Attribute Description, accepted value onafterprint An event that fires after a page is sent for printing or after the print window is closed. onbeforeprint An event that fires before a page is sent for printing. onbeforeunload The event is triggered when the visitor initiates a transition to another page or clicks “close window”. Allows you to display a message in the confirmation dialog to let the user know if they want to stay or leave the current page. onhashchange The event is fired when the hash part of the URL changes, for example when the user goes from example.domain/test.aspx#page1 to example.domain/test.aspx#page2 . onmessage An event occurs when a message is received through an event source. onoffline The event is triggered by the browser when the browser determines that the Internet connection has been lost. online The event is triggered by the browser when the Internet connection has been restored. onpagehide The event occurs when the user leaves the page through navigation, such as clicking a link, refreshing the page, filling out a form, etc. onpageshow The event occurs when the user navigates to the web page, after the onload event. onunload The event is triggered if the page does not load for some reason, or when the browser window is closed.