Учебник CSS - Оглавление

• Введение Краткое введение. О чём здесь речь.

• Урок 1: Что такое CSS? Немного о том, почему появился CSS и почему лучше использовать CSS поверх HTML для дизайна страниц.

• Урок 2: Как работает CSS? Основы синтаксиса CSS и создание вашей первой таблицы стилей.

• Урок 3: Цвет и фон Как работать с цветом и фоном на вашем web-сайте и как использовать фоновый рисунок.

• Урок 4: Шрифт Здесь вы узнаете о работе со шрифтами в CSS.

• Урок 5: Текст Замечательные возможности CSS при работе с текстом.

• Урок 6: Ссылки Как добавить к ссылкам различные эффекты и как работать с псевдоклассами.

• Урок 7: Идентификация и группирование элементов (class и id) Подробно об использовании class и id для специфицирования свойств выбранных элементов.

• Урок 8: Группирование элементов  (span и div) Подробно об использовании в CSS span и div как важнейших HTML-элементов.

• Урок 9: Боксовая модель Боксовая модель в CSS описывает боксы, генерируемые для HTML-элементов.

• Урок 10: Боксовая модель - поля & заполнение Изменение представления элементов свойствами margin и padding

• Урок 11: Боксовая модель - рамки Опции использования рамок на ваших страницах с помощью CSS.

• Урок 12: Боксовая модель - высота и ширина В это уроке мы рассмотрим, как легко можно определить высоту и ширину элемента.

• Урок 13: Всплывающие элементы (поплавки) Элемент может "всплывать" справа или слева с помощью свойства float

• Урок 14: Позиционирование элементов С помощью позиционирования CSS вы можете поместить элемент точно там, где это нужно на вашей странице.

• Урок 15: Наслоение с помощью z-index (Слои) В этом уроке мы рассмотрим, как редактировать перекрывание элементов с помощью layers

• Урок 16: Web-стандарты и проверка кода Этот последний урок - о W3C-стандартах и о том, как проверить корректность вашего CSS-кода.

Введение

Каскадные таблицы стилей/Cascading Style Sheets (CSS) это поразительное изобретение для улучшения вида ваших web-сайтов. Оно поможет сэкономить уйму времени и предоставит вам совершенно новые возможности в дизайне web-сайтов. CSS совершенно необходим каждому, работающему с web-дизайном.

Этот учебник поможет вам начать работать с CSS всего через несколько часов. Он разъясняет всё очень доходчиво и научит вас сложной этой технологии.

Изучение CSS увлекает. Читая этот учебник, выделяйте достаточное количество времени для экспериментов с изученным в каждом уроке материалом.

Использование CSS требует знания основ HTML. Если вы не знаете HTML, то начните с нашего Учебника HTML, прежде чем перейти к CSS.

Какое программное обеспечение необходимо иметь?

Не используйте при работе с этим учебником такие программы, как FrontPage, DreamWeaver или Word. Эти продвинутые программы не помогут вам в изучении CSS. Наоборот, они сильно ограничат ваше продвижение в этом направлении.

Вам понадобится бесплатный и простой текстовый редактор.

Например, Microsoft Windows поставляется с программой Notepad. Она обычно находится в Accessories меню Пуск, в Programs. Вы можете также использовать простой текстовый редактор, например Pico для Linux или Simple Text для Macintosh.

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

С этим учебником можно использовать любой браузер. Мы советуем иметь новейшую версию браузера.

Браузер и простой текстовый редактор - вот всё, что вам необходимо.

Давайте начнём!

Урок 1: Что такое css?

Возможно, вы уже слышали о CSS, но не знаете, что это такое? В этом уроке вы узнаете, что такое CSS и что он может сделать для вас.

CSS это акроним для Cascading Style Sheets/Каскадных таблиц стилей.

Что можно делать с помощью css?

CSS это язык стилей, определяющий отображение HTML-документов. Например, CSS работает с шрифтами, цветом, полями, строками, высотой, шириной, фоновыми изображениями, позиционированием элементов и многими другими вещами. Потерпите, и увидите!

HTML может (неправильно) использоваться для оформления web-сайтов. Но CSS предоставляет бóльшие возможности и более точен и проработан. CSS, на сегодняшний день, поддерживается всеми браузерами (программами просмотра).

Прочитав лишь несколько уроков этого учебника, вы сможете создавать собственные таблицы стилей и использовать CSS для придания вашему web-сайту великолепного вида.

В чём разница между css и html?

HTML используется для структурирования содержимого страницы. CSS используется для форматирования этого структурированного содержимого.

Согласен, это звучит как-то заумно. Но, пожалуйста, читайте дальше. Вскоре всё начнёт проясняться.

Давным-давно, когда Мадонна была девой, а парень по имени Tim Berners Lee изобрёл World Wide Web, язык HTML использовался только для вывода структурированного текста. Автор мог только размечать текст: "это - заголовок" или "это - параграф", используя HTML-тэги, такие как <h1> и <p>.

По мере развития Web дизайнеры начали искать возможности форматирования онлайновых документов. Чтобы удовлетворить возросшим требованиям потребителей, производители браузеров (тогда - Netscape и Microsoft) изобрели новые HTML-тэги, такие, например, как <font>, которые отличались от оригинальных HTML-тэгов тем, что они определяли внешний вид, а не структуру.

Это также привело к тому, что оригинальные тэги структурирования, такие как <table>, стали всё больше применяться для дизайна страниц вместо структурирования текста. Многие новые тэги дизайна, такие как <blink>, поддерживались только одним браузером. "Вам необходим браузер X для просмотра этой страницы" - такой отказ стал обычным явлением на web-сайтах.

CSS был создан для исправления этой ситуации путём предоставления web-дизайнерам возможностей точного дизайна, поддерживаемых всеми браузерами. Одновременно произошло разделение представления и содержимого документа, что значительно упростило работу.