Найти тему

Основы HTML и CSS для начинающих #2. Первый сайт

Оглавление

Всем привет! Наверное заждались следующей части бесплатного курса по HTML и CSS от Royal Web. Сегодня мы с вами напишем первый сайт, а также разберём основные теги в HTML, а также частично CSS код.

Итог второго урока по HTML и CSS
Итог второго урока по HTML и CSS

Более подробно про HTML вы можете узнать в нашей предыдущей статье.

Создание сайта

Не буду долго томить и, пожалуй, сразу перейду к делу. Создадим простенький сайт. Итоговый результат можно увидеть выше, а код будет выглядеть так:

Простой HTML код
Простой HTML код

Давайте быстренько разберём код. Теги <!DOCTYPE html> и <html></html> задают тип документа и объявля.т HTML код соответственно. Далее идёт тег <head></head>, в котором будет находиться вся информация сайта, которую не видит пользователь. Она нужна для браузера. В эту информацию входит meta -информация о сайте, а именно: кодировка, ключевые слова, название и описание. Затем идёт тег <title></title>, в котором содержится название сайта (оно отображается на вкладке) и это единственное, что будет видеть пользователь из тега <head></head>.

Последним идёт тег <body></body>. В нём содержится весь основной код сайта и всё, что увидит пользователь.

В нашем случае в тег <body></body> заключены заголовок <h1></h1> и абзац <p></p>.

Стилизация

А теперь займёмся простенькой стилизацией. Итоговый вариант будет выглядет так:

Итоговый сайт
Итоговый сайт

Это один из самых простых вариантов стилизации. Здесь всё достаточно просто. Перед фигурными скобками указывается имя тега или класса, для которого будет применяться стилизация. Далее, в фигурных скобках, указываются необходимые виды стилизации и их параметры. Пример CSS кода нашего сайта показан на изображении ниже:

CSS код
CSS код

Более подробное разъяснение всего кода будет в следующей статье. А пока наш первый сайт готов.

Понравилась статья? Тогда ставь лайк и подписывайся на канал. Дальше - интересней😎