Архив за Август, 2010 года

Основы CSS. Базовые понятия

Прежде чем переходить к дальнейшему рассмотрению HTML, в частности тега <body>, необходимо разобраться, хотя бы, с основными понятиями CSS.

CSSИтак, CSS (Cascading Style Sheetsкаскадные таблицы стилей) — технология описания внешнего вида документа, написанного языком разметки, в основном это будет HTML. Или, другими словами — это технология, которая позволит изменять цвета, стиль шрифта, размер блоков (элментов, тегов языка HTML).

Для чего придумли CSS?

Так как HTML никогда не предназначался для отображения внешнего вида документа, а был предназначен только для определения содержания (или схемы) документа, но не для указания того, какие цвета или шрифты использовать для отображения того или иного элемента (блока) в документе, например:

<h1>Это заголовок</h1>
<p>Это абзац.</p>

Здесь тег <h1> показывает, что текст внутри него будет заголовком, без указания каким стилем его отобразить. Точно таким же образом, тег <p> указывает бразуеру, что текст внутри него является абзацем.

Когда теги визуализации, такие как <font>, и цветовые атрибуты были добавлены в спецификацию HTML 3.2, начался кошмар для веб-разработчиков. Развитие больших веб-сайтов, где шрифты и цветовую информацию необходимо было добавлять на каждую страницу, стало долгим и дорогостоящим процессом.

Для решения этой проблемы, World Wide Web Consortium (W3C) создал CSS.

Продолжить чтение »

Основы HTML. Секция head

При взгляде на структуру HTML документа, видно, что она состоит из трех основных секций.

html_head

  • <html> – корень любого HTML документа, в котором располагаются все остальные секции (данный тег должен быть в единственном экземпляре, и должен присутствовать на каждой странице).
  • <head> – заголовок в котором прописывается служебная информация и инструкции браузеру, по отображению контента.
  • <body> – основная секция в которой находится контент, то есть вся полезная информация (текст, картинки, видео). Помимо контента, в этой секции расположена сетка сайта, либо его макет – описано местоположения основных разделов сайта, таких как: шапка, подвал, главное меню, боковые колонки, и т.д.

Тег <html> ничем особым не отличается, кроме того, что это есть корневой элемент – контейнер для всех остальных блоков. Поэтому приступим к более детальному рассмотрению секции <head>.

Продолжить чтение »