Здравствуйте, уважаемые посетители моего скромного блога для начинающих вебразработчиков и web мастеров ZametkiNaPolyah.ru. Что же, я продолжаю свой Видео блог и его раздел Как создаются шаблоны сайтов HTML и CSS. В общем, мы продолжаем создавать HTML шаблон сайта из PSD макета сайта.  В данном видео мы начинаем верстать HTML шаблон сайта, зададим первые стили CSS, разберемся с относительными URL адресами в CSS. А так же начнем создавать шапку сайта, которую разделим на два блока при помощи HTML тэгов <div>. В данном видео мы разберемся с тем, как задать фоновое изображение для HTML элемента при помощи картинки толщиной в 1 пиксель, то есть, с тем, как повторить картинку в CSS. Так как шапка сайта, которую мы будем создавать состоит из двух блоков разного цвета, то мы зададим каждому блоку свой цвет при помощи изображения и таблицы стилей. Еще раз повторю, что изображение, которое задает фон шапки сайта толщиной в 1px, поэтому мы будем его повторят при помощи repeat-x, чтобы растянуть изображение на всю ширину создаваемой шапки сайта.

Как создать шапку сайта. Продолжаем создавать HTML шаблон.

Как создать шапку сайта. Продолжаем создавать HTML шаблон.

Не забываем подписываться на RSS-лентуtwitter и на публичную страницу Вконтакте

На этом всё, спасибо за внимание, надеюсь, что был хоть чем-то полезен и до скорых встреч на страницах блога для начинающих вебразработчиков и вебмастеров ZametkiNaPolyah.ru. Не забываем комментировать и делиться с друзьями;)

Возможно, эти записи вам покажутся интересными


Выберете удобный для себя способ, чтобы оставить комментарий

This article has 2 comments

  1. Iglous Reply

    Очень интересный урок, но хотелось бы узнать, что это за шаблон представлен на скриншоте, дайте пожалуйста название и ссылку на него

    • Кирилл Reply

      Рад, что вам понравилось! PSD шаблон, по которому я создавал HTML макет сайта называется Smart business, а скачать это PSD шаблон сайта вы сможете вот по этой ссылке

Leave a Comment

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Loading Disqus Comments ...