Skip to content
Smartincom

Smartincom

крупнейшее независимое медиа в области веб-мастеринга, трафика, партнерских программ и заработка в интернете.

  • Вебмастеру
    • Вебмастеру, обратная сторона сайта
    • Словарь web и seo терминов
    • HTML
    • Сайт на HTML 5 — примеры кода
    • Свойства CSS
  • Продвижение и SEO
    • Раскрутка сайта в поисковых системах
    • Поисковые системы, поисковая система google, поисковая система яндекс
  • Партнерские программы
    • Как заработать деньги в интернете
  • Интересные статьи
    • Развлечения в интернете
    • Известные люди в истории Интернета
    • Статьи на тему заработка в Интернете

Свойства CSS

Руководство о том, каким образом при помощи языка CSS можно добавлять полезные и привлекательные эффекты к структурным элементам языка HTML, дано краткое описание некоторых наиболее часто применяемых свойств стилевых таблиц.

Я всегда мечтал о том, чтобы моим компьютером можно было пользоваться так же легко, как телефоном;
моя мечта сбылась: я уже не могу разобраться, как пользоваться моим телефоном.
Bjarne Stroustrup

 

Для включения стилей в html-документ применяются — каскадные таблицы стилей CSS (Cascading Style Sheet), с их возможностями значительно упрощается разработка web-страниц и управление полученным сайтом. В этом разделе кратко описаны некоторые часто применяемые свойства стилевых таблиц.

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

Правило, обязательно, состоит из селектора (в примере ниже это — H1) и блока объявления стилей, заключенного в фигурные скобки. Объявление так же состоит из свойства (COLOR) и его значения (Limegreen).
h1 {color: Limegreen}
Правило может содержать несколько объявлений, разделенных точкой с запятой. Для удобства чтения и редактирования правила записывают так, чтобы каждое объявление начиналось с отдельной строки.
h1 {color: Limegreen;
font-family: Verdana;
font-size: 16pх}
Но и записанное в одну строку, будет воспринято точно так же.
h1 {color: Limegreen; font-family: Verdana; font-size: 16pх}
Данное правило определяет для заголовка H1 цвет — color:Limegreen, наименование шрифта — font-family:Verdana и размер шрифта — font-size:16pх.

Это правило можно записать и так:
h1 {color: #32CD32; font: normal 16pх Verdana}
Но о стенографических свойствах — далее.
Включение CSS в HTML
Для включения CSS в html-документ используется элемент META, который задает служебную информацию и располагается внутри элемента HEAD.

В примере, атрибут http-equiv=»Content-Style-Type» указывает, что элемент META относится к таблице стилей, а атрибут content=»text/css» задает, что таблицы стилей написаны на языке CSS. Таблицы стилей могут быть внутренними, встроенными и внешними.

Внутренняя таблица стилей задается внутри элемента HTML при помощи атрибута STYLE. Ее недостаток в том, что она придает определенное значение только для одного элемента, для остальных придется задавать атрибут STYLE каждый раз.

 
Свойства CSS
Браузер покажет:
Свойства CSS
 

Встроенные таблицы стилей добавляются с помощью тегов STYLE и располагаются внутри элементов HEAD. При таком включении, всем заголовкам первого уровня, которые находятся на данной странице, будет применен красный цвет. И если сейчас необходимо будет изменить цвет заголовков, то сделать это достаточно будет только один раз.

H1 {color: red}

 

Внешними таблицами стилей являются те, которые помещены в отдельный файл с расширением .css и прикреплены к web-странице при помощи элемента LINK, который так же располагается внутри элемента HEAD.

 

Атрибут HREF задает URL таблицы, а REL указывает отношение подключаемого файла к документу. При добавлении основной таблицы стилей используется значение STYLESHEET.

Думаю теперь можно перейти к самому интересному — к изучению свойств CSS и их применению.
Свойства CSS
Все свойства CSS можно разделить на несколько групп:

Цвет и фон
 

Свойство COLOR
Свойство BACKGROUND-COLOR
Свойство BACKGROUND-IMAGE
Свойство BACKGROUND-REPEAT
Свойство BACKGROUND-ATTACHMENT
Свойство BACKGROUND-POSITION
Свойство BACKGROUND

 

Шрифт
 

Свойство FONT-FAMILY
Свойство FONT-STYLE
Свойство FONT-VARIANT
Свойство FONT-WEIGHT
Свойство FONT-SIZE
Свойство FONT

 

Текст
 

Свойство TEXT-DECORATION
Свойство TEXT-ALIGN
Свойство TEXT-INDENT
Свойство TEXT-TRANSFORM
Свойство VERTICAL-ALIGN

 

Интервалы
 

Свойство WORD-SPACING
Свойство LETTER-SPACING
Свойство LINE-HEIGHT

 

Списки
 

Свойство LIST-STYLE-TYPE
Свойство LIST-STYLE-IMAGE
Свойство LIST-STYLE-POSITION
Свойство LIST-STYLE

 

Блоки
 

Поля. Свойства MARGIN-TOP, MARGIN-RIGHT, MARGIN-BOTTOM, MARGIN-LEFT
Свойство MARGIN
Границы. Свойства BORDER-TOP-WIDTH, BORDER-RIGHT-WIDTH, BORDER-BOTTOM-WIDTH, BORDER-LEFT-WIDTH
Свойство BORDER-WIDTH
Свойство BORDER-COLOR
Свойства BORDER-STYLE
Свойства BORDER-TOP, BORDER-RIGHT, BORDER-BOTTOM, BORDER-LEFT
Свойство BORDER
Отступы. Свойства PADDING-TOP, PADDING-RIGHT, PADDING-BOTTOM, PADDING-LEFT
Свойство PADDING

html код
Свойства CSS 

Текст в CSS

01.05.202007.11.2021 SMARTINCOMRU 0 Комментариев

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

Читать далее
Интервалы в CSS
Свойства CSS 

Интервалы в CSS

25.04.202007.11.2021 SMARTINCOMRU 0 Комментариев

Интервалы в CSS задают расстояния между словами в тексте, между буквами внутри слова (межбуквенный интервал css), а так же управляют

Читать далее
Списки в CSS
Свойства CSS 

Списки в CSS

09.02.202007.11.2021 SMARTINCOMRU 0 Комментариев

С помощью языка CSS над списками можно выполнять множество действий. CSS можно использовать для изменения стиля отображаемых чисел или маркеров, их

Читать далее
Шрифт в CSS
Свойства CSS 

Шрифт в CSS

09.02.202007.11.2021 SMARTINCOMRU 0 Комментариев

Управление шрифтами в CSS не сильно отличается от HTML, однако использование CSS дает свои преимущества. Во-первых пользоваться CSS намного удобнее, а во-вторых

Читать далее
Блоки в CSS
Свойства CSS 

Блоки в CSS

09.02.202007.11.2021 SMARTINCOMRU 0 Комментариев

Блоки в CSS представляют собой самостоятельный объект, имеющий форму прямоугольника. Все элементы HTML — документа представляют собой самостоятельные блоки, которые

Читать далее
Цвет текста и цвет фона в CSS
Свойства CSS 

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

09.02.202007.11.2021 SMARTINCOMRU 0 Комментариев

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

Читать далее

Свежие записи

  • Ремонт iphone в Алматы
  • Передовые решения в разработке сайтов и сервисов онлайн
  • Бесплатный SEO анализ сайта, проверка сайта на ошибки
  • Аренда сервера и ЦОД от «Датахата»
  • Накрутка бесплатных лайков Instagram без заданий и регистрации
  • Наушники их виды
  • Сервис раскрутки Instagram, Telegram и других площадок
  • Ноутбуки в Алматы — Самые популярные товары
  • Почему iphone лучший телефон?
  • Аренда сервера в дата-центре
Полетели к ТОПу прямо сейчас!

Подпишитесь на рассылку и первыми

Получайте полезный контент без воды и банальностей.

Иногда с котиками. =)

[contact-form-7 id="1072" title="Рассылка Новости"]

Последние сообщения

  • Ремонт iphone в Алматы 30.09.2021
Копирайт © 2023 Smartincom. Все права защищены.
Тема ColorMag от ThemeGrill. Создано на WordPress.