Архив рубрики: Основы CSS

CSS (Каскадные таблицы стилей) – это отличное изобретение благодаря которому значительно облегчился процесс создания сайтов. С помощью таблиц стилей стало возможным управление внешним видом любого количества страниц, а также воплощение более современного и красивого дизайна.

Содержание

  1. Что такое CSS. Отличие CSS от HTML. Преимущества CSS
    Узнаете, что такое CSS.
  2. Как работает CSS. Создание и подключение таблиц.
    Каким образом следует записывать стилевые правила.
  3. Цвет фона и текста в CSS.
    Как менять цвет фона и цвет текста.
  4. Шрифты в CSS.
    Стиль, семейство, вес, начертание.
  5. Оформление текста в CSS.
    Свойства форматирования текста.
  6. Списки в CSS
    Создание всевозможных видов списков в CSS.
  7. Оформление ссылок в CSS.
    Информация о изменении внешнего вида ссылок с помощью CSS.
  8. Типы селекторов в CSS
    Содержится информация о способах изменения стилей отдельных элементов на веб-сайте с применением селекторов CSS.
  9. Блоковая модель в CSS
    Описывается, из чего состоит и как можно применять блоковую модель в CSS для верстки сайтов без использования HTML-таблиц.

Списки в CSS

Давайте рассмотрим основные свойства CSS, предопределяющие внешний вид списков. list-style-type list-style-position list-style-image list-style Все эти свойства применяются как к упорядоченным, так и к неупорядоченным спискам. Свойство LIST-STYLE-TYPE Определяет каким будет вид маркера элементов списка: в виде букв, цифр, кружочков и т.д. Может принимать такие значения: disk– маркер, имеющий закрашенный круг; circle – маркер с незакрашенным кругом; square – маркер… Читать далее »

Оформление текста в CSS

Теперь рассмотрим какие бывают свойства CSS отвечающие за форматирование текста. text-align text-decoration text-indent text-transform letter-spacing word-spacing Свойство TEXT-ALIGN Свойство выравнивания текста, аналогичное атрибуту ALIGN применяемому в html. Всего бывает четыре значения: left – выравнивание по левому краю (значение по умолчанию); right – выравнивание по правому краю; center – выравнивание по центру; justify – выравнивание по… Читать далее »

Цвет фона и текста в CSS

Очень важным моментом в CSS является цвет и фон. Цвет в CSS указывается так же, как и в html, с помощью значения (например #f9f9f5) или названия цвета (yellow, grey, green). Как использовать цвета в CSS СодержаниеОсновными свойствами CSS, определяющими цвет текста, цвет фона и расположение фоновых рисунков, являются: color background-color background-image background-repeat background-attachment background-position background Теперь о… Читать далее »

Что такое CSS. Отличие CSS от HTML. Преимущества CSS

CSS (Cascading Style Sheets) – в переводе означает каскадные таблицы стилей. После появления CSS значительно облегчилось создание сайтов, так как сделать хороший дизайн без их применения крайне сложно. Но главное то, что CSS позволяет делать сайты намного быстрее. CSS может работать с таблицами, шрифтами, изображениями и демонстрирует гораздо большие возможности, чем обычный html. Например, если необходимо изменить… Читать далее »

Блоковая модель в CSS

Умение применять блоковую модель CSS делает возможным сверстать сайт без использования HTML-таблиц. Насколько мы знаем из HTML существуют элементы блочные и строчные. С помощью блочных элементов создаются таблицы, заголовки, абзацы и, как правило всегда имеются отступы. Характерным для блочных элементов является то, что их нельзя расположить в одной строке. Строчные элементы можно располагать в одной строке… Читать далее »

Оформление ссылки в CSS

Возможно Вы часто наблюдали как на разных сайтах при наведении на пункт меню например, становится текст или все что вокруг него другого цвета. Также, возможно появление или исчезновение подчеркивания одновременно с изменением цвета ссылки. Все это реализовано при помощи использования CSS, а точнее с помощью псевдоклассов – которые необходимы для учета определенных свойств html документа.… Читать далее »

Как работает CSS. Создание и подключение таблиц

Отличительной особенностью CSS является отсутствие таких понятий как элемент, тег или атрибут. Структура таблиц состоит из ПРАВИЛ, которые определяют, какой внешний вид должен иметь определенный элемент в документе. Рассмотрим структуру правила: На изображении видно, что сначала пишется селектор, указывающий к какому html тегу (тегам) предназначается данное свойство. Затем идет блок объявления стилей, который содержит в себе… Читать далее »

Шрифты в CSS

Несколько свойств, оказывающих влияние на шрифт в CSS: семейство, стиль, вариант, вес, размер. Принципы по которым браузер определяет использование нужного шрифта. Содержание: font-family font-style font-variant font-weight font-size font Свойство FONT-FAMILY FONT-FAMILY переводится с английского как семейство шрифта. Это свойство определяет каким будет шрифт. Существует три основных семейства шрифтов: Serif – шрифт “засечками”, ярким примером является – “Times… Читать далее »

Типы селекторов в CSS

Данный материал посвящен основам оформления стилей на интернет-ресурсе при помощи селекторов. Селекторы в CSS используются для определения конкретного  элемента в html-странице, для которого надо применить  или изменить стиль CSS. Виды селекторов в CSS Селектор по элементам; Селектор по классам; Селектор по id; Контекcтный селектор. Селектор по элементам Для придания необходимого CSS-стиля в данном случае в качестве селектора записывается название html элемента. Например, достаточно прописать нужный стиль для… Читать далее »