Download "Знакомство с основным каркасом страницы | Курс HTML & CSS | Занятие №1"

"videoThumbnail Знакомство с основным каркасом страницы | Курс HTML & CSS | Занятие №1

0:40

Для чего создан HTML

6:00

Редакторы кода

8:00

Каркас HTML страницы

11:30

Что такое тег, какие теги есть

18:00

Комментарии внутри HTML

22:00

Элементы страницы (блоки)

31:30

Заголовки в HTML

34:40

Что такое атрибут в HTML

40:30

Специальные символы в HTML

42:40

Что такое HTML валидатор

48:40

HTMLBOOK

Адаптивная верстка интернет магазина с НУЛЯ. Выполняю реальный заказ. Верстка сайта за $150

Адаптивная верстка интернет магазина с НУЛЯ. Выполняю реальный заказ. Верстка сайта за $150

Channel: ДЕН - подорожую та програмую

Верстаем карусель, HTML & CSS - Часть 2 | Динамический веб-сайт

Верстаем карусель, HTML & CSS - Часть 2 | Динамический веб-сайт

Channel: Андрей Андриевский

HTML с нуля: урок 1 - как работает Интернет и что такое сайт

HTML с нуля: урок 1 - как работает Интернет и что такое сайт

Channel: selfedu

HTML с нуля: урок 5 (часть 2) - фреймы

HTML с нуля: урок 5 (часть 2) - фреймы

Channel: selfedu

HTML с нуля: урок 5 (часть 1) - таблицы

HTML с нуля: урок 5 (часть 1) - таблицы

Channel: selfedu

HTML с нуля: урок 10 - пример создания макета HTML страницы

HTML с нуля: урок 10 - пример создания макета HTML страницы

Channel: selfedu

HTML с нуля: урок 4 - ссылки, теги div и span

HTML с нуля: урок 4 - ссылки, теги div и span

Channel: selfedu

HTML с нуля: урок 2 - инструментарий, структура документа, стандарты

HTML с нуля: урок 2 - инструментарий, структура документа, стандарты

Channel: selfedu

Курс HTML и CSS Профессиональная вёрстка сайтов Часть 1

Курс HTML и CSS Профессиональная вёрстка сайтов Часть 1

Channel: TY. ACADEMY

HTML с нуля: урок 7 - поля ввода, кнопки, списки

HTML с нуля: урок 7 - поля ввода, кнопки, списки

Channel: selfedu

HTML

CSS

Верстка

Курс

Теги

курс html5

курс html

как выучить html и css

как выучить html и css с нуля

как выучить html и css самому

верстка сайта

верстка сайта с нуля

верстка сайта из psd

Учим верстку

учим программирование

html5

css3

css3 уроки

html уроки

что такое html

что такое html и css

html tutorial

html tutorial for beginners

php

javascript

less

программирование

python

php7

sql

mysql

курсы_программирования

программирование

python

python3

js

ооп

паттерны

парсеры

00:00:00

good day, dear

00:00:02

video viewers of my YouTube channel,

00:00:04

and today will be the first lesson after the

00:00:08

previous one in one lesson, and here we will

00:00:10

begin to begin to sort out some

00:00:12

practical things

00:00:13

and get acquainted with the concept of

00:00:16

layout and we will go through the

00:00:19

first 10 stages, even a little more for

00:00:24

acquaintance and 1 In the first lines of writing the

00:00:27

code, we will begin by answering the

00:00:30

question for what purposes html and css were formed in the first place,

00:00:35

but initially it was pure html,

00:00:38

what is this and hypertext

00:00:41

text markup for, what was it all

00:00:43

invented for, for what purpose,

00:00:45

how did it do its job how it

00:00:50

works to this day, for example,

00:00:52

I’ll take the word we all know,

00:00:56

imagine that I have some text

00:00:59

that we’ll now go to some

00:01:03

site and take for ourselves, I’ll show you what it

00:01:10

looks like, let’s take this text

00:01:17

from the end of the door, this is the case let's insert

00:01:22

this thing here,

00:01:24

remove this, imagine that you have

00:01:27

this text

00:01:28

somewhere, pictures and something else, and you

00:01:32

need to post it on the Internet,

00:01:34

if you take the text in the form in

00:01:37

which it is now in Word and just

00:01:39

publish it like a page on the Internet, then,

00:01:42

accordingly, output it in this form and

00:01:44

get this text to make some part of it

00:01:47

bold, some part of the text

00:01:51

to be made italic somewhere in some word,

00:01:54

make a link to all of this, all this

00:02:00

required some additional

00:02:03

actions that is, it was necessary to write

00:02:05

logic that would allow

00:02:08

certain sections of the page elements to be

00:02:11

somehow provided to the

00:02:14

user and, accordingly, the

00:02:15

html language was developed for this.

00:02:18

I will not delve into the history of when, in

00:02:21

what year, what was done, this is not so

00:02:23

important because in our country after all, there is a

00:02:24

practical component,

00:02:26

and if anyone is interested, of course, you can

00:02:28

go to Wikipedia and generally read all this for

00:02:31

yourself if you have a desire, that

00:02:33

means in order to study and work

00:02:37

with html or in the future css there, in 10 or

00:02:40

two classes we need certain

00:02:43

tools,

00:02:44

which means what tools we need we need

00:02:48

a browser,

00:02:49

preferably more than one, because for the first

00:02:52

lesson we only need one 2 browsers,

00:02:55

but when we approach

00:02:57

cross-browser adaptability,

00:02:59

we need browsers of different

00:03:02

engines

00:03:03

on which we can test our

00:03:05

pages and check how

00:03:07

adaptive the layout is, how

00:03:10

cross-browser compatible it is, if anyone doesn’t know

00:03:13

what adaptability is, this is when

00:03:15

a page adapts very conveniently to

00:03:17

all

00:03:18

screen resolutions, that is, these are mobile

00:03:20

tablet devices, these are some

00:03:23

gadgets of various resolutions, this is a phone

00:03:26

and there, say, with three inches, swords three of

00:03:30

it and above, and tablets there start at 6

00:03:34

7 inches up to 12 also laptops with different

00:03:37

resolutions all this is called

00:03:38

adaptive layout, also when your

00:03:40

page looks very good and beautiful

00:03:41

on all screen resolutions

00:03:44

cross-browser is when the intended

00:03:47

functionality and at the same time the layout

00:03:50

is also displayed equally on all

00:03:53

devices, that is, regardless of the

00:03:55

browser used, that means we we will

00:04:00

use google chrome we will

00:04:02

use safari

00:04:03

microsoft edge and mozilla why we

00:04:06

will not use opera and the Yandex

00:04:09

browser because they are on the same

00:04:11

engine as google chrome that is, we just

00:04:13

need to use google chrome and

00:04:15

it will essentially also be displayed in the

00:04:17

Yandex browser and in Opera, at first,

00:04:21

of course, we will do everything either in google

00:04:24

chrome or mozilla, and only when we

00:04:26

test cross-browser compatibility and

00:04:28

adaptability, and of course we will turn

00:04:30

to other engines;

00:04:31

also, each browser has its own panel

00:04:34

for a web developer for debugging in chrome,

00:04:39

it is called by pressing the f12 key and looks like in

00:04:43

this way, that is, it can be

00:04:45

located either on the right side

00:04:47

or we can place it at the bottom in the

00:04:50

bottom part of the screen, you can even

00:04:53

unpin it and make it independent, you

00:04:57

went in the wrong place as an independent window, that is, this is

00:05:01

how it will look,

00:05:03

we can move it and place it in

00:05:07

any place where we are interested, that is,

00:05:09

depending on the page and goals, we will

00:05:11

place this window in our own way; well, of course,

00:05:14

it is better to place it at the bottom because if

00:05:17

you place the window on the right, it will steal part of the

00:05:20

screen width and our content will be

00:05:23

narrowed, which will not always be good for us

00:05:25

with this panels we will get to know each other

00:05:28

in future video lessons, I’m just saying

00:05:30

that we will use this, we will also

00:05:33

need graphic editors,

00:05:35

this will be photoshop in our course, this

00:05:38

will only be photoshop, there will be a special

00:05:41

lesson where we will work only with

00:05:43

photoshop, prepare a layout for layout,

00:05:46

we will look at the grid

00:05:49

photoshop layout before from the designer how to

00:05:53

make this grid correctly how to read

00:05:56

this grid how to transfer and cut out

00:05:58

elements for layout with

00:06:01

marketa photoshop we also need a

00:06:03

code editor, basically this is over pad +

00:06:06

+

00:06:07

uses sable and they use brackets in general there are

00:06:11

a lot of them let’s look at but

00:06:14

pad + + is an editor that is absolutely

00:06:18

free and you can easily download it and

00:06:20

use it, but it has

00:06:23

code highlighting, it has the ability

00:06:26

to set the syntax encoding, that

00:06:28

is, it is very convenient and for the first time a

00:06:29

pretty good code editor,

00:06:32

there is also a tool with a line that I

00:06:36

would even say probably better than the pad

00:06:38

because it is more modern,

00:06:40

more progressive, but it is also

00:06:43

absolutely free, you

00:06:44

can download it and install it here. We

00:06:48

see that I have a kind of tree of your

00:06:51

site where you can open folders and

00:06:53

move tabs in folders, well, that

00:06:56

is, it is more interesting. I’ll be

00:06:58

writing auto-completion code in the subs,

00:07:01

of course it’s not very good during

00:07:03

training, but it depends on each person personally, that

00:07:07

is, the skating rink in what and

00:07:09

in what boat and preferences

00:07:12

to work there also from break this is

00:07:13

quite an interesting editor with

00:07:15

absolutely free code we’re building in it belly

00:07:20

live preview, that is, you type the code and

00:07:22

immediately open the window and

00:07:24

see how this code is displayed. It’s also an

00:07:27

interesting code editor, but

00:07:30

lately I haven’t been using it,

00:07:32

mostly I use online links to

00:07:34

all of these editors, of course I’ll attach the video below,

00:07:36

you can download it look,

00:07:39

click on each one individually, there wo

00:07:42

n’t be any problems with this,

00:07:44

then we will use an ftp client

00:07:47

to connect to the hosting, upload

00:07:50

files there,

00:07:51

edit something, change something, and so on,

00:07:54

but this will be the final lessons in

00:07:57

which we will already design the finished

00:07:59

page or site hosted

00:08:25

we do all the unnecessary stuff, essentially a bare

00:08:31

frame and let’s look at

00:08:35

this page, even what

00:08:37

this html page is, it has a certain frame,

00:08:41

that is, there is an indication of

00:08:44

what type of html it is html5, that is, you don’t

00:08:47

need to study this, you just need to

00:08:50

understand enough that this is the first line this

00:08:53

means that we write using

00:08:56

html5 technology, that is, we use

00:08:59

html5 standards, there will be a link below under the video

00:09:02

to read what is the difference between us 5 and html

00:09:06

4, I don’t want to show you here what they used to

00:09:09

write from the header, you can

00:09:10

watch old videos on my channel

00:09:13

where and in In 2016, I recorded videos, you

00:09:16

will see the difference there, suddenly these type

00:09:20

of before the expansion, how it was all written,

00:09:21

I’ll just say that now it’s all much

00:09:23

simpler, that is, we write just such a cap

00:09:26

and that’s enough, after that there is a

00:09:29

paired one, so what is single porn because

00:09:33

we will talk, I will talk very

00:09:35

often, don’t be alarmed now if

00:09:38

this is wildly unknown to you, it’s incomprehensible to all of this, I

00:09:40

will explain the versions, remember over

00:09:42

time, porn means it has a pair,

00:09:45

that is, here is the opening tag, here is

00:09:48

the closing html, this is actually what it

00:09:53

says that next comes the entire

00:09:56

document html page

00:09:58

after it there are two paired hide tags,

00:10:01

here in this place we will

00:10:03

have all the service information,

00:10:05

that is, this information is intended

00:10:08

only for browsers and for search

00:10:10

engines, that is, here between the

00:10:13

opening tags and the closing tag we

00:10:16

we will post things that are

00:10:18

only needed by search engines, then here is

00:10:22

everything that we will write here,

00:10:24

people will not see it, for example,

00:10:27

let’s write that our

00:10:31

first page,

00:10:41

we see that on the page itself we do not

00:10:45

see any text, but here

00:10:48

in this place entry our first

00:10:50

page is the title itself, here at the

00:10:53

top is what we wrote in

00:10:56

tightly,

00:10:57

that is, this information that is not

00:10:59

shown on the main

00:11:01

content page but is displayed in that climate, then let's

00:11:05

go through the codes, which means after the paired

00:11:10

hide service tag because we have a

00:11:12

steam room like body, in fact, everything that we

00:11:16

write in the body will be displayed

00:11:18

exactly in the body text, now I press counter

00:11:22

with the keyboard shortcut, or you can go

00:11:25

here and press

00:11:27

safe, just yes, here is the combination of counter with

00:11:30

we save the document, go to

00:11:34

update

00:11:35

and apparently this the picture is the so

00:11:38

-called text fish, that is, in the code,

00:11:41

everything that is in these between these

00:11:43

tags will already be available to a person on the

00:11:46

page, let’s now talk

00:11:49

a little about tags,

00:11:51

what tags are and how they are used, which

00:11:54

means, as I already mentioned in this video,

00:11:56

there are paired and single tags

00:11:59

here we see essentially only paired

00:12:04

tags if we do not take into account this first

00:12:07

line, that is, we have html, here we see the

00:12:10

underline line and here the

00:12:12

underline line here so it opens

00:12:14

here because

00:12:16

closes the difference between an open and a

00:12:19

closed tag is hearing

00:12:22

that is, look, I’ll now

00:12:24

write, let’s say a paragraph, and then

00:12:29

I’ll close it here right away and the main difference here

00:12:32

could be some kind of text that here

00:12:35

comes an angle bracket the name of the tag and

00:12:40

some content goes and then comes the

00:12:41

same thing only with hearing we put a slash and

00:12:45

this indicates that it is so closed, that is, the

00:12:47

action of

00:12:48

this tag on this text

00:12:50

ends here in this place we

00:12:53

will return to these tags and analyze

00:12:56

some of them in this lesson and

00:12:58

learn with them to work like this means

00:13:03

let's figure out why we need an

00:13:07

opening and closing tag in general,

00:13:09

why can't we just write like this,

00:13:12

write some information or the same

00:13:14

thing, write body, then code

00:13:15

information or some other

00:13:18

closing tag, it says that the

00:13:21

action of what was done in

00:13:23

the opening tags, this is where

00:13:25

it ends,

00:13:26

let's look at how it's

00:13:28

written here in the example: lorem ipsum in

00:13:33

bold text, let's do

00:13:35

this for ourselves in bold text in our code,

00:13:38

for making the text bold,

00:13:42

two tags are responsible,

00:13:43

let's do it here below I’ll write 1 tb, let’s

00:13:48

say this is from the old markup, it’s

00:13:52

not recommended to use it now,

00:13:55

and 2 so strong

00:13:57

is already html 5 markup, that is, according to

00:14:00

html5 standards, according to which we are

00:14:02

writing the name here, naturally we will use

00:14:04

this text, but both tags make the text

00:14:07

bold, let’s we copy you so strong,

00:14:10

we’ll put it here, we’ll click the outline with on that is,

00:14:15

the same thing, we’ll save

00:14:17

and see what happens,

00:14:19

we’ll click update and we’ll see that absolutely

00:14:22

all of our text has become

00:14:24

bold, and we wanted to make only

00:14:26

this section text, so since this

00:14:30

paired so and we do not have its action anywhere, that is, so that it is

00:14:35

not all this that is bold, but only this,

00:14:37

we need this tag somewhere to

00:14:39

suspend its action,

00:14:41

accordingly, in this place we

00:14:43

write exactly the same so only with a

00:14:45

closing bracket, that is, with we hear we

00:14:49

say, here

00:14:51

the text begins in bold, here this

00:14:55

bold highlight ends, let's

00:14:57

save again, remind you the

00:14:59

counter with hot keys,

00:15:01

update and see that we have this

00:15:04

section of the text remaining bold and everything else

00:15:07

has become normal, this is how

00:15:09

the pair works, so it means

00:15:12

by Regarding tgb,

00:15:14

let’s do the same thing at the very end,

00:15:16

we saw the same thing, I’ll highlight this

00:15:22

section with the code in bold and you will understand that there is

00:15:25

no difference, the contour with the saved one

00:15:27

has been updated, we see that they are also bold,

00:15:30

respectively, as if

00:15:32

logical questions arise, why is it

00:15:34

so strong,

00:15:35

etc. .P. if they both do the same

00:15:37

function, it would have been text

00:15:41

before the advent of html5, it seems to have

00:15:44

remained in html5 now, it works, but it is

00:15:48

considered a tag that is not recommended to be

00:15:50

used, that is, perhaps in html 6

00:15:53

or html 7, if this is the case, it will simply

00:15:56

be removed from the markup and it will not work

00:15:58

and the code in which you used it will also

00:16:01

stop performing its function,

00:16:03

so we use what is

00:16:07

called strong, it has, as it were, for

00:16:10

Google, for a search engine for Yandex

00:16:12

and other search engines, a more

00:16:15

logical meaning, that is, it assumes

00:16:16

that if you highlighted this text

00:16:18

in bold, then you still

00:16:21

need to pay attention to this text, but TKB,

00:16:24

which simply goes like this

00:16:27

to be recorded, he once said

00:16:29

that this is just a visual highlighting with

00:16:31

bolder text, that is, now

00:16:34

what he did before tb is done using

00:16:37

css styles, we will do this with you

00:16:40

when the css boom goes through, so there’s

00:16:42

nothing wrong with it, the main thing is

00:16:46

to remember that we use so strong

00:16:48

so we wouldn’t use it, so let’s

00:16:53

talk in this lesson about what

00:16:55

comments are, after all, we have there is a

00:16:58

section of text that we mark up with

00:17:02

html ice tags and let’s say we want

00:17:05

some part of the text of the code

00:17:08

then in ours hide in the comments how

00:17:12

this is done, let’s do it like this and

00:17:15

assume that this is what we want to

00:17:17

comment out, that is, we don’t just

00:17:18

delete it, well, the mortar is presented

00:17:20

important information that cannot be deleted

00:17:22

must be left means that we are doing we are

00:17:25

writing an angle bracket sign! two lines

00:17:29

and a comment begins, but comments

00:17:32

it has a beginning and has an end to its

00:17:35

action, the end of the action is done with two

00:17:38

arrows and an angle bracket, only there are

00:17:41

no more signs here! that is, here with an

00:17:43

exclamation mark, here without an

00:17:46

exclamation mark, let's save, let's go to

00:17:48

our page and here we are, go now,

00:17:51

from here everything will disappear, we update and

00:17:53

see that our text has been shortened, what are

00:17:58

comments for? Comments are needed

00:18:00

to leave some

00:18:02

messages for yourself that is, you are doing something,

00:18:05

write, you may have here not only

00:18:06

chalk and scripts, some

00:18:09

java script, there may be other scripts, there

00:18:12

may be some insertions of frames of

00:18:14

some blocks, we will go through all this

00:18:17

naturally

00:18:18

and from- due to the fact that there are a lot of lines of code,

00:18:20

you may need to comment on something

00:18:22

or suppose you

00:18:24

have a functionality on the page, let’s say

00:18:26

this is the functionality on the page and at

00:18:29

some point you decided that you do

00:18:30

n’t want to show this banner and you

00:18:33

just take a piece code that

00:18:34

displays this banner, you comment on it, that

00:18:37

is, the banner itself and the code remain,

00:18:41

but you commented it out and the functionality is

00:18:43

no longer displayed in the browser, that is,

00:18:46

you can very easily comment on

00:18:48

some blocks of

00:18:49

elements of your page, this is a

00:18:52

comment,

00:18:55

so let me do it as follows:

00:18:58

here at the very top I’ll write this

00:19:01

thing, all these files will be on

00:19:08

the disk and you can

00:19:14

look at it all and use it as an example,

00:19:15

so that means what’s next what’s

00:19:22

next let’s look at the next

00:19:25

next tags I’ll do something like this here at the bottom, it

00:19:28

would remind me of a point and

00:19:32

I’ll comment on this, this will be such a hint

00:19:36

for you, here we’ll do it like this, here too

00:19:41

I’ll write tags and give

00:19:46

them some comments, so I’ll

00:19:49

write a paired one like this, to make it bold,

00:19:59

we’ll look at it further, and the next paired one, this is how

00:20:03

this paragraph

00:20:05

looks like this

00:20:11

1 Dec you

00:20:16

are devoting a section of text,

00:20:30

let’s now work with paragraphs,

00:20:33

which means a paragraph is a pair, so, and

00:20:35

accordingly, since we can’t

00:20:37

just leave the text as

00:20:39

it is, we have to make it a paragraph,

00:20:43

let’s do this, we’ll have one

00:20:45

paragraph, and this we’ll have there will be a second

00:20:47

paragraph,

00:20:49

which means we write a

00:20:52

paragraph here and there it is, we close it,

00:20:59

we do the same thing here we write a paragraph and here at

00:21:03

the end we close it, we save, we go to

00:21:09

our page, we update and we see that

00:21:11

we now have two paragraphs,

00:21:13

what is the difference between a paragraph and regular

00:21:15

text, well, first of all, we notice that

00:21:17

we have some kind of

00:21:19

padding, yes, that is, we have a

00:21:21

space here between them, there is

00:21:23

a space here, a protrusion is here

00:21:25

we have a little indentation and there is,

00:21:28

well, accordingly, we have a

00:21:31

certain indentation everywhere,

00:21:32

and if there is a lot of paragraph, then of course

00:21:35

it all becomes readable and It’s easier

00:21:38

to work with this. You noticed that inside

00:21:41

the paragraph

00:21:42

there is also the same strong text

00:21:45

that we placed here earlier, why

00:21:49

and why this happened this way, this concerns

00:21:54

nesting, that is, there are elements,

00:21:58

I like any paired or single, so we

00:22:01

will call an

00:22:02

element on the page there are elements that

00:22:05

allow you to put other elements into yourself

00:22:08

at the same time as there is the

00:22:11

same country that we can’t

00:22:14

put a paragraph inside, I can’t

00:22:17

touch on this topic in a little more detail in the next

00:22:19

lesson now, so as not to burden you too much

00:22:21

in the first lesson, I’ll just

00:22:23

say so imagine that there is a

00:22:25

big box, here is a video paragraph, there are

00:22:28

small boxes, so

00:22:30

we can put a small box in a big one, now

00:22:32

we can’t put a big one in a

00:22:34

small one, what is it called correctly and

00:22:37

what is it for? I

00:22:39

will repeat it again and go into more detail

00:22:42

in the next lesson

00:22:43

now on We won’t stop with this

00:22:45

and so we’ve sorted out the paragraph, now let’s

00:22:49

also look at how the text is made in italics,

00:22:52

let’s

00:22:54

make this lorem ipsum italic, it will

00:22:58

also be a small box, so

00:23:00

we can safely put

00:23:01

it in our big

00:23:07

big box, let’s say this is also

00:23:14

paired so the text in italics

00:23:16

let's write porn there and so that means

00:23:23

here we write our oh and here and

00:23:29

close and save go here and

00:23:33

here we now have the text in italics

00:23:36

once and our text in italics but also

00:23:40

like TBM

00:23:43

and text rank so oh this is outdated html

00:23:47

4 tec and the new html5 will

00:23:52

look like this, that is,

00:23:54

we change it to e.m.

00:23:57

and the same thing is saved here, we go

00:24:02

here, we update and we see that nothing

00:24:05

has changed, that is, so oh and the topic is not

00:24:11

responsible for the same thing, that is, well,

00:24:15

pronounce it correctly, and

00:24:16

yes, if you already stick to the English language,

00:24:19

but somehow I’m here I’m used to

00:24:21

saying in general like this, oh our food

00:24:25

and like this it’s the same thing, only

00:24:28

this tag is more correct and I

00:24:31

recommend using it

00:24:32

because it relates specifically to

00:24:35

html5 markup so I’ll

00:24:38

leave it here like this makes italic let's

00:24:42

look at this, it's very interesting,

00:24:47

which underlines

00:24:50

this text looks like this, it's

00:24:53

written like this, and the ball is single,

00:24:58

so this is the first text that

00:25:01

we'll get to know, which will be single,

00:25:02

now between the first and second

00:25:04

paragraph there will be a line like this,

00:25:07

here it is the entire width of the browser window is

00:25:11

very rare, they are used mainly

00:25:14

some visual elements are done

00:25:16

using CSS, well, if you suddenly

00:25:20

notice this somewhere, I want you to know

00:25:24

why we’ll write it down and we’ll have it here,

00:25:34

then there’s also a very important tech which

00:25:37

we will now analyze, it is also

00:25:40

single, this is a line break tag, I’m

00:25:44

now doing the next one, I’ll take this

00:25:46

text, copy it again, copy

00:25:54

these inserts, delete it,

00:25:56

I’ll just make it with more text and make

00:25:58

it bulky in one fell swoop, so that there

00:26:01

won’t be enough of it, I’ll save it, let’s go here

00:26:05

look, if we now

00:26:07

narrow the browser, we get a

00:26:09

lot of text here, it’s all one paragraph,

00:26:11

let’s assume that we want to

00:26:14

divide it into some pieces and make a

00:26:16

forced line break,

00:26:18

what is a line break? A line break

00:26:22

is when we do approximately the following

00:26:24

thing, here is our word

00:26:26

let's do it like this and we put the

00:26:30

cursor here, press enter, here's one

00:26:32

line break,

00:26:33

press another m pro 2 line break,

00:26:35

we can do this line break anywhere,

00:26:38

this is called a line break, yes, that

00:26:40

is, this is how

00:26:43

it looks like in ours html

00:26:45

and now I’ll demonstrate this, it means there is

00:26:48

such a wonderful one

00:26:51

called b rbr

00:27:04

b-r from single so that is, it does not

00:27:07

need a pair for line breaks

00:27:10

hr is also single because. now let's

00:27:18

do a few

00:27:20

line breaks here, first of all, here

00:27:22

we'll insert a line break, and here's where we'll

00:27:29

also make a line break in the 60s,

00:27:33

save our document, go to the browser,

00:27:36

update and see what we had here, here we

00:27:41

had a line break, here we have it

00:27:44

line break and here is the 60s from a new

00:27:47

line,

00:27:48

that is, there is such a kind of indentation and out

00:27:50

there as in a paragraph, but as if the line

00:27:53

begins with our text begins with a

00:27:56

new line, these breaks can be done

00:27:58

as much as you like, that is, let’s do it here, I’ll

00:28:00

do it there I don’t know

00:28:03

233 line breaks, that is, now we

00:28:07

will have two empty lines here,

00:28:09

update and see here we have

00:28:11

a tag here and here, that is, three times

00:28:14

thoughts made a line break, this can come in

00:28:18

handy when, say, you need to

00:28:21

divide something beautiful in a large paragraph

00:28:23

visually the text and inside the

00:28:26

hyphens no one ever does, they do

00:28:28

either 1 or 2

00:28:30

hyphens, but there is no need to abuse such things

00:28:33

now it looks like two

00:28:35

paragraphs, that is, if we remove

00:28:38

these line breaks here and just

00:28:41

write that this is one paragraph here

00:28:43

this is different, essentially nothing

00:28:45

will change, but since this relates to

00:28:47

one paragraph, here we have

00:28:49

line breaks working. I also forgot to

00:28:53

tell you this thing: how to save an

00:28:55

html document in general, look, I’ll click here

00:29:00

in the counter in editor, create a

00:29:03

new document and

00:29:05

so that it was displayed in the browser and we

00:29:07

could view it as an html page, we

00:29:10

click the file save as and let’s have

00:29:15

index.htm

00:29:16

leaves I’ll call it, let’s say it doesn’t matter what

00:29:20

you call it, I can give it a two.

00:29:22

and here we write html html that is, after

00:29:26

point 1 of the html extension and click

00:29:30

save now if we go to our

00:29:33

folder here is our file 2 html

00:29:40

drag it into the browser and it

00:29:43

opens as an html page

00:29:45

let’s write something here so we

00:29:51

can see that this is real html yes, I

00:29:56

won’t even write a doctype, I’ll just

00:29:59

write a pair like this and write a

00:30:03

level 1 header here and save,

00:30:10

now give it here,

00:30:12

update it, and now we see that this is our html, we

00:30:16

close this page, we

00:30:19

also close this document,

00:30:21

we return to our document, that is

00:30:23

this is how we save the document so that it

00:30:25

can be viewed in a browser, that is,

00:30:26

the main thing is that the extension was html,

00:30:30

so let's look at a few more tags

00:30:33

and we will and will continue further, yes, that

00:30:39

means the next one, so which we will look at,

00:30:42

this is the title, which means h 1 episode,

00:30:47

I even like this h1 and not like that, let

00:30:52

’s do it like this

00:30:58

6 now let’s put the headings like this,

00:31:06

paired t by the way,

00:31:11

that means if we draw an analogy with Word, there are

00:31:17

different types of headings h1 to

00:31:22

h6, and h1 is the most important heading

00:31:26

and there should be only one per page,

00:31:28

and a 6

00:31:29

is the least a meaningful heading let's

00:31:33

make it right here I'll write h1 like this let's

00:31:40

write the 1st level heading like this

00:31:46

then we'll just copy this thing

00:31:48

to make it faster and here

00:31:57

we'll just change the values two three

00:32:00

four five and six similarly and here

00:32:05

since this is paired like this 6 and here we

00:32:12

will write

00:32:14

2

00:32:17

3

00:32:22

4 of the

00:32:25

fifth and sixth levels, now let's

00:32:31

save and go to the page and you will

00:32:33

now visually understand what they

00:32:35

differ in and here is actually ours and

00:32:37

the headings of the 1st level heading 2 3 4 5 we

00:32:42

see that 6 is practically not visible and it is

00:32:45

even smaller than us text why are

00:32:49

all these headings needed why and 6 levels well,

00:32:53

firstly they are needed for the logical

00:32:55

layout of the page

00:32:57

this is 1 2

00:32:59

heading 1 2 and 3 levels is very

00:33:05

important for SEO promotion of

00:33:07

resources if anyone has heard it means all this

00:33:11

when you promote your site in

00:33:15

search engines Yandex and Google and

00:33:17

others so that it is visible for

00:33:20

certain queries as high as possible in the

00:33:22

search, yes there in the first positions, in the

00:33:24

second, and so on, so the 1st

00:33:27

level heading is very important;

00:33:29

what you write here is the

00:33:32

second level heading it plays the role of a header

00:33:35

that breaks the contents of the page into

00:33:37

logical parts. 3. The header simply

00:33:40

complements the logical parts with certain

00:33:43

blocks. When we are laying out the

00:33:45

combat page with you, the real page,

00:33:48

then we will talk in more detail about

00:33:50

headers, I will tell you how to

00:33:54

use them correctly and where they are not needed

00:33:56

apply

00:33:57

and where necessary so I think that’s enough in terms of

00:34:02

tags for today, let’s

00:34:04

talk about things like

00:34:07

tag attributes, which means we only talked about tags,

00:34:12

we said that there are guys and single

00:34:14

tags,

00:34:15

only two single tags were sorted out, this is the

00:34:18

br tag line break and so evening this the

00:34:22

horizontal line and a lot of

00:34:25

paired tags were sorted out, we also realized

00:34:27

that everything that is in the head

00:34:30

relates to service information in no

00:34:32

way affects the

00:34:34

output of the main page and everything that

00:34:37

is in the body block

00:34:39

it relates to the content that

00:34:42

the user will see

00:34:44

now let's talk about attributes

00:34:47

are such an understanding as an attribute of a tag, what

00:34:51

attributes are responsible for,

00:34:52

well, an attribute, first of all, can set

00:34:55

some styles for the tag itself, that is,

00:34:58

if we write some

00:35:02

additional attribute here,

00:35:04

we will directly influence

00:35:07

this element itself, that is here

00:35:10

we have a header element h1 and we

00:35:13

can influence

00:35:17

this header using attributes how attributes are written in general

00:35:19

how the attribute is used it is

00:35:22

always written in opening tags that is, there

00:35:25

is a paired deck h1 here it opens

00:35:27

here it closes if we have a

00:35:31

single toy teck

00:35:32

let’s say it’s evening then it it is written

00:35:36

immediately after the gag itself before the

00:35:38

closing bracket, that is, we put

00:35:40

a space and here we write the attribute, the attribute

00:35:44

always has the following type of notation, that

00:35:47

is, let's do it, it means the name of the

00:35:52

attribute then

00:35:56

equals these, these are the quotation marks and

00:36:02

the value of the attribute,

00:36:08

that is, this is what the syntax for

00:36:12

writing an attribute looks like goes and the name of the attribute

00:36:14

without a space we write equal without a space

00:36:18

we put double quotes and inside the quotes

00:36:21

we start writing

00:36:23

attributes and so I wrote down the

00:36:29

3 most basic attributes that we

00:36:32

most often will encounter 1 attribute is

00:36:36

IDEN it indicates the name of the style

00:36:39

identifier and which can then be

00:36:41

accessed via javascript

00:36:43

or through some other server the

00:36:45

programming language can also be accessed

00:36:48

when using css styles, there is a

00:36:52

class attribute that defines the name of the class,

00:36:55

which also allows you to then access the

00:36:57

name of a specific element and the

00:37:00

last attribute most used is the

00:37:02

style attribute, which allows you to

00:37:05

write your own styles specifically in any element.

00:37:10

these are the 3 attributes that

00:37:13

we will use most often

00:37:15

now, for example, I’ll write only the

00:37:17

style attribute,

00:37:19

I’ll write the css style defined there,

00:37:23

just don’t pay too much attention to this,

00:37:26

the main thing is to understand how

00:37:27

the attribute is written, so look, I

00:37:30

’m writing the attribute here, remember the formula, yes, here’s our

00:37:33

formula the

00:37:34

attribute name is equal and the value is in quotes,

00:37:38

which means look, put a space, write

00:37:41

style

00:37:46

style, then a space and double quotes, that

00:37:50

is, this is all written together inside, there

00:37:53

should be no spaces, that is,

00:37:55

the space is only between the tiger and the attribute, there is

00:37:59

a space here, and when we write that the

00:38:01

attribute itself, no spaces no, that means here

00:38:04

comes the name of the attribute whose

00:38:06

name is style

00:38:08

equals quotes and in the quotes themselves we already

00:38:10

write the value of what I’ll write now you do

00:38:14

n’t focus too much on it, it does

00:38:18

n’t really matter right now, I

00:38:21

just want to show you

00:38:23

a record of how it works as an example with the styles we

00:38:27

will return there in the third or subsequent

00:38:29

lessons, I wrote the attribute became

00:38:32

and gave it the value of fantasy four

00:38:34

pixels you with other words I said

00:38:36

that I want the 1st level heading to have a

00:38:39

resolution of thirty-four pixels

00:38:41

now I will save the page the code is more precise, I go

00:38:45

here and click refresh and I see that

00:38:48

my block has become smaller, that is, it

00:38:51

was a larger size, I wrote

00:38:54

thirty-four pixels and it of course

00:38:56

became smaller. If I write

00:38:58

seventy-four pixels here, it will be saved, then of

00:39:01

course my header will become

00:39:03

huge, that is, I applied the

00:39:06

attribute that allowed directly

00:39:08

here to the page element h1, apply your own

00:39:15

dimensions, font size, that is,

00:39:19

what I actually wanted to show is that

00:39:21

attributes are written like this, for example,

00:39:23

let’s also write using the style

00:39:27

attribute for the heading h2, but here we

00:39:31

’ll use a

00:39:32

style like cola with CSS and write here,

00:39:36

let’s say the words

00:39:38

red and put a semicolon for now, it does

00:39:43

n’t matter, we

00:39:45

’ll look back at the css syntax later, update it and see that the

00:39:49

chapter of level 2 has become red, that

00:39:51

is, we applied the steel attribute back

00:39:55

to the h2 element, painted it red, that’s how

00:40:00

the attributes work,

00:40:03

what else do I want in this in the lesson

00:40:07

I want to discuss special symbols with you, what

00:40:10

are special symbols, let's go to

00:40:13

this link, now copy the

00:40:18

link, of course, it will be in the description,

00:40:20

in general, all the links to which I go,

00:40:23

they will all be in the description, here are the actual

00:40:25

special symbols,

00:40:27

special symbols are certain symbols

00:40:30

that are best written either

00:40:35

in in this form, either in the form of a name or in the

00:40:38

form of a code, because the symbol does not always sleep,

00:40:42

since you set it, it can be

00:40:44

correctly displayed in html in the

00:40:48

html layout on the page, let’s say we

00:40:51

want to place a

00:40:52

copywriting sign, that is, of course, you can

00:40:55

copy it like this and

00:40:56

put it but it would be more correct and

00:40:59

good form to copy either the

00:41:01

code of the symbol or its name, that is,

00:41:04

let's copy the name,

00:41:07

go to our page and at the very end here, just like

00:41:11

that, put the code, we can

00:41:14

put a space if we want, press

00:41:17

the outline with go to our page,

00:41:19

update and we see our

00:41:22

copywriting symbol, that is, this is how

00:41:24

special symbols work, you don’t need to learn anything special here,

00:41:26

in fact, you don’t need to

00:41:29

learn them, just when you need some

00:41:31

special symbols, you go to google, type

00:41:33

in what kind of symbol you need and

00:41:36

get the code, or here

00:41:38

you save this link somewhere for yourself, there are a

00:41:40

lot of symbols here, but in

00:41:43

fact there is an even larger table with symbols,

00:41:47

there are a lot of them and you any symbol there

00:41:50

that you need, you copy there

00:41:53

the sign of water you are some kind or something else all

00:41:56

this you can copy it and,

00:41:57

of course, paste it into your code and it

00:42:00

will be displayed beautifully. I also want to talk about

00:42:05

this understanding of validation, which

00:42:07

means look here at the very top of

00:42:09

the page, we indicated that we will

00:42:11

use

00:42:13

html5, this is what we use html5, this is what

00:42:16

this entry indicates, that is,

00:42:19

we put up a sign! we wrote doctype

00:42:21

html and we tell the browser that we

00:42:25

will use the syntax and structure of the

00:42:27

html 5 page format, how to understand

00:42:31

how correctly or incorrectly

00:42:33

we are using it for this, a

00:42:36

wonderful resource validator that

00:42:38

was developed for this purpose,

00:42:41

go to the page of this validator and

00:42:44

here we are we can do the following:

00:42:47

indicate the address of the page

00:42:50

if there is this page, well, let’s

00:42:52

take this page, yes, I’ll select it,

00:42:55

copy it, enter it here,

00:42:58

press check and now we will see what

00:43:01

the validator will show us and look at what we are

00:43:04

receiving, it says that there is an error in the

00:43:08

encoding itself page then

00:43:13

we have it is not indicated missing now let's

00:43:19

see by the way, I'll tear it off,

00:43:26

but he says that there is some strange

00:43:30

encoding, that is, he expected to

00:43:34

see utf-8 there, but instead of utf f8 there you

00:43:37

see what the encoding is, this

00:43:39

line of encodings we'll come back to

00:43:42

next during the lesson we will definitely talk,

00:43:43

and then it shows some

00:43:45

errors until there is an error there,

00:43:48

writing the connection of the script

00:43:51

even says which line is located somewhere in which line,

00:43:54

but it doesn’t matter that someone else’s

00:43:57

document has a tab to check the file and

00:44:01

here we will now select the file means

00:44:05

which I'm working with now and let's look

00:44:09

at the validations in this lesson 1, our html index,

00:44:14

so we've loaded it and let's check it

00:44:17

against the validator, so it means that it says

00:44:25

it says that we don't have a record of some

00:44:29

language, that is, that we should give the

00:44:31

language attribute about We will talk about this a little

00:44:34

later, he says that there is no

00:44:38

encoding specified, we will also talk about this in the

00:44:41

next lesson, and then

00:44:43

he talks about some errors,

00:44:47

that something was used incorrectly,

00:44:50

some symbols were used in the wrong way, that is, you

00:44:53

poured out on here so,

00:44:57

well, it’s clear why it spilled out, it’s all

00:45:01

because of the text of the fish that we use,

00:45:03

that is, from this text he

00:45:06

spilled errors for us because there are mixed

00:45:10

languages and it seems like it’s burning that this is

00:45:13

wrong, that is, he first of all

00:45:15

asks us to indicate which one in the code the language we

00:45:19

use here is the attribute

00:45:21

land ho, we'll go back to it, we'll

00:45:23

talk about it, and the language is written rouen

00:45:27

or some other language, and that's why he can't

00:45:29

understand what language all this

00:45:31

rubbish is written in and what special characters are

00:45:33

there, what else to do with them, but so that

00:45:37

you understand that there is such a

00:45:38

service where you can go to the site address,

00:45:42

indicate to the page specifically check

00:45:44

the validator,

00:45:45

load your page with layout,

00:45:49

this is also indicated, and here you can

00:45:52

select the encoding, let’s say if you are here

00:45:54

f8, use indicate that iii tf 8

00:45:58

document type if you html5, then you can

00:46:00

indicate what you are doing in html5 and then

00:46:04

check the document using these

00:46:06

parameters, that is, if you suddenly have something

00:46:08

that doesn’t match these parameters, well,

00:46:11

he says that you don’t have youtube 8 and

00:46:14

windows 1252, he’s probably telling the truth

00:46:19

because the server gives the following code to

00:46:22

fix this, let's add the encoding and

00:46:25

transfer it from the next lesson to this

00:46:27

means the quote is added as follows, it is

00:46:29

written like this: meta

00:46:33

then the attribute charset f8 is added, this is

00:46:38

single because it doesn’t close, that is,

00:46:40

we wrote it like this and save it,

00:46:43

which means charset is just an indication of the

00:46:46

utf-8 encoding, this is the encoding itself,

00:46:49

why is it f8, I won’t explain it for a

00:46:52

very long time, it will take a lot of time, just

00:46:54

remember that we always

00:46:57

use the utf8 encoding by default, why and what is

00:47:00

it different from others, you can

00:47:02

google the main thing now, just believe

00:47:05

and always use it, let me refresh

00:47:07

the page

00:47:08

again, connect our file and once again

00:47:13

indicate that we will have utf-8 and

00:47:15

html5 encoding, check and see that it no longer

00:47:21

complains about the encoding, that is, it says

00:47:22

okay, all the errors are gone, the only

00:47:26

thing he says is why you don’t have the

00:47:28

lang ru attribute in html, well, he wants this attribute,

00:47:32

let’s put this attribute in it, it’s

00:47:35

placed like this, that is, in the html tags,

00:47:38

in this paired tag, which is

00:47:40

closed here at the end, we set

00:47:43

the attribute and said that our text should

00:47:45

be in Russian,

00:47:47

save again, refresh the page, then

00:47:53

go back again, update again,

00:47:56

add us html, open back, specify the

00:48:00

utf8 encoding, indicate back that we are

00:48:02

writing according to the html5 standard and click

00:48:05

check and see that it is our layout

00:48:08

Now it’s perfect, that is, there are no

00:48:11

problems, nothing, because we carried everything around, we

00:48:16

fixed it, we wrote the encoding, we

00:48:18

wrote that our page will be in Russian

00:48:23

and everything works great, so

00:48:29

I’ll attach all these links, I also want to

00:48:31

show you the resource with which we will

00:48:36

work and very often we will refer to it,

00:48:38

this is an html book resource,

00:48:40

that is, already on it, here I showed

00:48:42

special characters, let's go to the main

00:48:45

page,

00:48:46

everything you need to see now and

00:48:49

look through at home, this will be your homework,

00:48:51

one of the homework assignments, this is the next one,

00:48:54

it means there are tags here,

00:48:57

let's click here on doctype and

00:48:59

we read the doctype element,

00:49:01

which means the doctype element is intended to

00:49:04

indicate the type of the current document, that is,

00:49:06

the type refers to html5, we indicate it right here,

00:49:09

remember I said at the beginning of the video

00:49:12

that there are many types of

00:49:14

layout markup,

00:49:16

so this is how html 401 is written,

00:49:20

this is so scary there was a record, there

00:49:23

were three types, there was a transition, but there was a

00:49:27

record, then there was a frames set record for

00:49:31

frames and, as it were, the usual standard

00:49:33

html 4 strict cut, that is, then

00:49:37

html5 appeared, which is recorded like

00:49:40

this, that is, compare this record

00:49:42

as before it was necessary to record and

00:49:44

this is how you feel the difference, this is how we

00:49:47

will actually write down for all

00:49:48

documents and we won’t worry about all this

00:49:51

because it doesn’t matter here anymore, you can

00:49:53

read a little, let’s look at

00:49:56

those flexible and also sorted out all these

00:49:59

porn single tags here tb yes we talked to you

00:50:01

means TBM set

00:50:05

the font to bold, that is, well, it

00:50:09

actually

00:50:10

says what it does, there’s an example,

00:50:12

you can even see how it will look

00:50:14

in the browser,

00:50:15

here’s the paragraph we looked at today,

00:50:19

let’s see what he writes about, well, here’s the

00:50:23

h1 headings, click on this

00:50:25

h1 tag, what’s on? offers 6 headings of

00:50:29

different levels, what did I tell you about in

00:50:32

general, homework, look at the three

00:50:35

tags that I wrote down today, that is, you do

00:50:37

n’t need to take new ones for now, don’t

00:50:39

clutter your head, here you open

00:50:42

the page, read what it is because html what

00:50:45

is so head python what is t km and

00:50:49

me the body

00:50:50

and these are all the tags, that is, for each

00:50:52

tag you need to read their meanings, that

00:50:56

is, a more detailed description of what they

00:50:58

mean, the tags are all here, that

00:51:00

is, we are looking for, can we knock down here also

00:51:02

here it goes, yes, if the demon and I

00:51:05

find this tag and read carefully,

00:51:07

look at the examples, we can even

00:51:09

copy and paste it in a notebook

00:51:12

to see how it will work, we

00:51:16

will also have homework on our

00:51:19

channel below in the description there will be

00:51:22

homework for you too download

00:51:25

all the sources there, that is, there will be this

00:51:28

file, I’ll save you, I won’t do anything

00:51:30

with this file, you can work,

00:51:33

practice, do something, and in the

00:51:35

next lesson we’ll move on to

00:51:39

work with tags, we’ll

00:51:42

work with links, we’ll work with you

00:51:44

create several pages, try to

00:51:46

connect them with each other, move on in

00:51:50

general, then it will only be more interesting,

00:51:52

maybe the weird one will be more difficult, but if

00:51:55

you listen carefully to what is

00:51:57

not clear, ask questions in the

00:51:59

comments, go read on the Internet, that

00:52:02

is, don’t be afraid,

00:52:03

look, don’t be afraid to read the html book

00:52:06

everything on in Russian everything is clear, you

00:52:09

will succeed, believe in yourself and believe it is

00:52:11

not difficult, the main thing is to spend half an hour

00:52:15

on your homework, do

00:52:17

some training and see you in the

00:52:19

next lesson, that’s all for now I was glad to

00:52:21

tell you all this and show you and

00:52:24

I hope that you found it interesting until the

00:52:26

next one meetings

Description:

★ Подпишись на мой канал с бесплатными курсами программирования! ► моя IDE: https://www.jetbrains.com/ru-ru/webstorm/ ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ ★ НАШЕ КОМЬЮНИТИ ★ ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ ★ Телеграм (Front End): https://t.me/joinchat/FQXf-hN9LRuCosQCWtzY3g ★ Discord (All): https://discord.com/invite/UVbzw89vM8 ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ ★ Тайм-коды ★ ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ 00:40 -- Для чего создан HTML 06:00 -- Редакторы кода 08:00 -- Каркас HTML страницы 11:30 -- Что такое тег, какие теги есть 18:00 -- Комментарии внутри HTML 22:00 -- Элементы страницы (блоки) 31:30 -- Заголовки в HTML 34:40 -- Что такое атрибут в HTML 40:30 -- Специальные символы в HTML 42:40 -- Что такое HTML валидатор 48:40 -- HTMLBOOK Автор: Андриевский Андрей Раздел: Динамический сайт https://notepad-plus-plus.org/downloads/v7.5.4.html https://www.sublimetext.com/ https://brackets.io/ МАТЕРИАЛЫ: https://drive.google.com/drive/folders/1hnfKmIlNTLbsv93BJ1bSo6Vql7DnJpvO?usp=sharing Зеркало: https://drive.google.com/drive/folders/1hnfKmIlNTLbsv93BJ1bSo6Vql7DnJpvO?usp=drive_open ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ ★ РЕКОМЕНДУЮ ВИДЕО ПО ТЕМЕ ★ ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ ● [[ Практическая верстка ]] : [[ https://www.youtube.com/watch?v=_5v2ETZI7LY ]] ● [[ Курс HTML & CSS ]] : [[ https://www.youtube.com/watch?v=GFqCX2AefQk ]] ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ ★ ПОПУЛЯРНЫЕ ПЛЕЙЛИСТЫ ★ ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ ● Курс HTML & CSS: https://www.youtube.com/watch?v=GFqCX2AefQk ● Базовый курс JavaScript: https://www.youtube.com/watch?v=4GkJvPCuVXg ● Базовый курс Python: https://www.youtube.com/watch?v=IbGUmqCrjuc ● Базовый курс PHP7: https://www.youtube.com/watch?v=I02F4oCD14o ● Динамический сайт с нуля: https://www.youtube.com/watch?v=yEJJlbjT1uk ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ ★ ПОДДЕРЖАТЬ АВТОРА И КАНАЛ ★ ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ https://www.liqpay.ua/uk/checkout/380638562538 Webmoney: Z166344793421 R369744777501 U871336351200

Preparing download options

Popular

HD video

Only sound

All

* — If the video is playing in a new tab, go to it, then right-click on the video and select "Save video as..."

** — Link intended for online playback in specialized players

Questions about downloading video

How can I download "Знакомство с основным каркасом страницы | Курс HTML & CSS | Занятие №1" video?

http://unidownloader.com/ website is the best way to download a video or a separate audio track if you want to do without installing programs and extensions.
The UDL Helper extension is a convenient button that is seamlessly integrated into YouTube, Instagram and OK.ru sites for fast content download.
UDL Client program (for Windows) is the most powerful solution that supports more than 900 websites, social networks and video hosting sites, as well as any video quality that is available in the source.
UDL Lite is a really convenient way to access a website from your mobile device. With its help, you can easily download videos directly to your smartphone.

Which format of "Знакомство с основным каркасом страницы | Курс HTML & CSS | Занятие №1" video should I choose?

The best quality formats are FullHD (1080p), 2K (1440p), 4K (2160p) and 8K (4320p). The higher the resolution of your screen, the higher the video quality should be. However, there are other factors to consider: download speed, amount of free space, and device performance during playback.

Why does my computer freeze when loading a "Знакомство с основным каркасом страницы | Курс HTML & CSS | Занятие №1" video?

The browser/computer should not freeze completely! If this happens, please report it with a link to the video. Sometimes videos cannot be downloaded directly in a suitable format, so we have added the ability to convert the file to the desired format. In some cases, this process may actively use computer resources.

How can I download "Знакомство с основным каркасом страницы | Курс HTML & CSS | Занятие №1" video to my phone?

You can download a video to your smartphone using the website or the PWA application UDL Lite. It is also possible to send a download link via QR code using the UDL Helper extension.

How can I download an audio track (music) to MP3 "Знакомство с основным каркасом страницы | Курс HTML & CSS | Занятие №1"?

The most convenient way is to use the UDL Client program, which supports converting video to MP3 format. In some cases, MP3 can also be downloaded through the UDL Helper extension.

How can I save a frame from a video "Знакомство с основным каркасом страницы | Курс HTML & CSS | Занятие №1"?

This feature is available in the UDL Helper extension. Make sure that "Show the video snapshot button" is checked in the settings. A camera icon should appear in the lower right corner of the player to the left of the "Settings" icon. When you click on it, the current frame from the video will be saved to your computer in JPEG format.

What's the price of all this stuff?

It costs nothing. Our services are absolutely free for all users. There are no PRO subscriptions, no restrictions on the number or maximum length of downloaded videos.