Cоздание html сайта для начинающих ‘Основные теги. Создание каркаса страницы’

Автор Nikita Stoianov
Cоздание html сайта для начинающих  ‘Основные теги. Создание каркаса страницы’

День добрый друзья с вами.

Дмитрий Афанасьев и мы начинаем изучать HTML и CSS для веб-разработчика и так. Давайте приступим, что работа нам потребуется в первую очередь нам потребуется браузер использовать мы будем Firefox в дальнейшем вы узнаете узнаете. Почему именно данный браузер и также потребуется дополнение фаербаг и так скачать Firefox установить если он вас не установлены установить дополнение фаербаг по данному адресу дали нам потребуется редактор для HTML кода использовать мы будем программа notepad Plus Plus и скачать её можно по данному адресу notepad-plus-plus орг там где вам создать папку HTML CSS и в данной папке мы будем вести обучение вести разработку в данной папке требуется создать ещё трипод — это папка Files папка гсы папка Style.

Итак приступим открываем программу notepad-plus-plus и создаем новый документ со следующим кодом на данный документ требуется сохранить в нашу папку кнопка HTML CSS сразу в корне и назовём моего Index HTML чтобы notepad нам в конце просто не добавил.

Нам нужно будет поменять расширение на. Алтае ABS нажимаем сохранить проверяем как — это у нас. Получилось Да вот создался Index HTML и в конце нету. txt возвращаемся блокнота. Давайте разберем, что мы здесь написали строка номер один doctype HTML данные строкой мы сообщаем браузеру. Что за документ у нас загружается в данном случае мы сообщаем о том, что загружается документ HTML на второй. Мы открываем теги HTML и закрываем. Ивана строке 12 — это главный Tag HTML документа. Иона символизирует начало документа и соответственно коня. Лента Далее идет Head Head открыли Head закрыли. Как видно из пояснения в теге Head размещается заголовке страницы подключение CSS файла vcf файлов и разные. Техническая информация далее идёт так. Бади Бади открылся на восьмой строке ibody закрылся на строке в теге Body у нас располагается сама страница весь наш HTML код который формирует страницу располагается именно в теге Body. Итак давайте сформулируем наш заголовок. Нашид и. Допиши всегда следующий год отель META charset utf-8 с помощью данного типа мы определяем техническую информацию в страницу. Техническая информация — это то, что страница у нас имеет кодировку utf-8 и. Дали тег title title — это заголовок нашего ну и соответственно чтобы мы его видели. Давайте напишем заголовок документа. Давайте сохраним сяе посмотрим в браузере, что у нас получилось сохраняем документ приходим в нашу папку и кликаем для того чтобы документ открывался в браузере внимание здесь у нас вместо заголовка вместо нашего текстовки заголовок документа пришли крокозябра — это наиболее типичная ошибка начинающих поэтому я вам. Её показывай и сейчас я вам покажу как её разрешить. Суть в том, что сам файл у нас создался по умолчанию не utf-8, а здесь мы указываем, что браузер должен рассматривать данный файл как utf-8 соответственно русские символы у нас пришли. Вот такими вот кракозябрами с помощью программы notepad-plus-plus можно поменять кодировку документа для этого нужно перейти в encoding и сделать конвертацию convert to utf-8 without Bom на сделали конвертацию сохранили перешли в браузере. Обновили страничку, а вот пожалуйста нормальная кириллица и. Давайте с помощью fargo посмотрим структуру нашего документа активируем фаербаг вот у нас открылся переходим на вкладку HTML и видим нашу структур которым SRS на файле и создать заголовок Head с двумя тегами и пустой пустой. Баден возвращаемся блокнот дали. Давайте оформим Tag Body создадим каркас нашего сайта первое, что мы добавим — это Tag div. Ты где фотоэлемент блочного типа предназначен для выделения определенных моментов сайта то есть определённые логические структуры блоки странице помещаются в данные теги ut2 бывает атрибуты атрибуты то есть какое-то описание данного тега. Например у тега. Мета есть атрибут charset и соответственно значение данного атрибута атрибут charset специфичный специфический атрибуты и предназначены только для атрибутами. То есть если мы часы. Запишем в каких-то других играх то браузер — это не поймет для. Димы здесь определили атрибут ID attribute ID можно определить для любого элемента для любого тега, но суть в том, что идентификатор соответственно должен быть уникальной на данной странице. То есть если мы определили для данного tdf идентификатор под названием то соответственно более никаких других блоков не должно быть соответствующего такого же идентификатора. Для чего нужны идентификаторы. И в частности для чего мы определили идентификатор для данного тега идентификаторов в таблице стилей мы можем указать стиле специально для данного тега с данным идентификатором во-вторых при помощи GS мы можем обращаться к данному тегу менять его содержимое. И внешний вид удалить его или создать копию на основе него то есть же какие-то какие-либо действия по сути идентификатор — это как бы имя данного тега с помощью которого мы непосредственно только к нему можем обратиться. Итак с помощью данного того. Мы создали каркас для нашего документа. То есть — это самый большой главный блок который будет определять ширину высоту нашего документа. Давайте наполним его структурой из чего у нас состоит сайт самое начало страница сайта.

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

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