Веб-разработка. Урок 3. Как создавать веб-страницы

Автор German Usachev
Веб-разработка. Урок 3. Как создавать веб-страницы

Здравствуйте дорогие друзья.

Добро пожаловать на третий урок видеокурса по печке. Сегодня мы с. Вами рассмотрим.

Из чего состоит в документ как составлять его структуру и посмотрим как выглядит работает панель разработчика в браузере Google Chrome для этого.

Давайте сначала создадим новый файл в редакторе саблайм текст 2 раза на верхнюю полоску чтобы открыть набираем сочетание клавиш контрл ф английская чтобы сохранить файл назовем его Index HTML если у вас остался файл index.php File будет содержать себя код написанный на языке HTML — это язык который понимают браузера и на его основе показывают результаты пользователя поэтому мы должны ему явно указать, что наш кот написана на языке HTML напишем doctype HTML. Это означает, что вот этого документа написана на языке HTML то, что мы написали. То есть то, что находится внутри угловых скобок — это и есть. ТТК является одиночным тегом есть ещё парные теги HTML код теперь. Нам нужен тег который будет указывать, что внутреннего содержится HTML код — это и есть HDMI записывается следующим образом должен быть написан внутри этого тега без флеша означает открывающийся. ТТК слышим — это закрывающийся этот хэштег записывается следующим образом закрывающий. ТКМ содержится информация нужна для нас для разработчиков также информацию нужное браузеру. Когда вы открываете вкладки своем браузере. То увидите название каждой вкладке задержка там находится отвечает тактовая записывается следующим образом открывающий и закрывающий тег тайтл и внутри пишем. Например онлайн-магазин нужно также добавить еще одну строку charset utf-8 сохранить документ и обновите страницу в браузере, что название вкладки стало таким — это строка сообщает браузеру, что на нашей странице будет использоваться набор символов в кодировке utf-8. Подробнее об этом вы узнаете на курсы HTML CSS. А пока просто пишите о своих системой документы. Теперь давайте создадим другой. Так — это Tag Body — это тоже парный тэг и всё, что мы напишем будет видно на странице в. Иматре напишем интернет-магазин если мы обновим страницу в браузере. То Увидим, что появилась наша надпись мой интернет магазин. Весь основной код пишется внутри тега Body давайте рассмотрим следующие строительный элемент — это т.д. — это тоже парный тег является блочным то есть на странице он выглядит. Как прямоугольник и занимает всю доступную ширину внутри таких тегов всегда начинается с новой строки. Давайте попробуем изменить следующим образом внутри напишем. Добро пожаловать и ниже мой интернет-магазин. Мы также обернуть в тег div. Давайте посмотрим как ты где выглядит на странице для этого. Открой браузер и правой кнопкой крикнем на надписи. Добро пожаловать выберем пункт. Меню при наведении на элемент div span Element мы можем видеть с вами какое место на самом деле занимает. Тедди теперь давайте рассмотрим один из — это декспан — это тоже парный тег для того чтобы посмотреть как он работает. Чем отличается от срочно замене все наши коллеги из нас фан страницу. Мы видим, что на странице надписи встали рядом друг с другом, а из панели элемент увидим. Какую площадь занимает эти книги на странице практически все сайты имеют на странице так называемую шапку сайта — это специально название сайт контакты и прочей информации. Вы можете разместить вашу шапку в виде, но для этого есть специальный TAG Heuer работает он точно также как и ты сидишь название чтобы можно было удобно в ходе обозначить, что в этом блоке у нас с вами располагается в шапках. Давайте перейдем к следующему виду заменим данный тег span на Hover другой спан наверх из. Лего Обновите страницу то она будет выглядеть как в предыдущий раз — это больше вопрос предпочтения и удобство, а также является хорошим тоном и другой программист. Когда будет смотреть. Восход сможет быстрее сориентироваться в вашей воле так называемых бегом. То есть он используется в зависимости от контекста данном случае логично в начале страницы написать шапку сайта использовать этот которая, что внутри будет располагаться та часть которая на странице выглядит как в. Ватсапе следующим данным мы рассмотрим тег H1 используется для того чтобы обозначить заголовок на странице написано не уделяется крупным является блочным элементом и парнем бегом более одного раза на одной странице там уже. Это сбивает с толку поисковые машины когда они заходят на ваш сайт и пытается понять о чём эта конкретная страница. Так что. Используйте на каждой отдельной странице только один раз давайте наверное браузер и посмотрим на результат следующее которые мы рассмотрим будет, а — это парный чего создаются ссылки на другие страницы, но чтобы он ничего работу. Давайте создадим. Другой документ для этого просто перейдём в паху и скопировал существующий документ назовём скопированный документ HTML пусть у нас — это будет страница с открытым каталоге нашего интернет магазина HTML содержимое тега H1 интернет-магазин и сохрани. Таким образом у нас есть два отдельных документ перемещаться на нашем сайте давайте для этого в каждом из наших документов создадим меню начнём с файла Index HTML в нашем мой интернет-магазин и. Давайте создадим ещё один тардив сразу поставим закрывающий тег span главная страница. Они же поставим наших ссылочку напишем, а внутри поставим равно HTML и напишем интернет-магазин игрушек атрибуты могут быть различными дополнительную информацию для каждого тега в данном случае у нас появился атрибут хлеб который имеет значение.

0 комментариев
0

Читайте также