slogin.info

ihc 468x60 1 1
< >
Звезда активнаЗвезда активнаЗвезда активнаЗвезда активнаЗвезда активна5 / 5
 
Автор: Администратор
Просмотров: 2466
Вы уже знаете синтаксис построения каскадных таблиц стилей. Все начинается с селектора, которому мы хотим задать определенный стиль. Обращаться можно по тэгу, например, для всех тэгов <p></p> стиль в CSS будет иметь вид:
p {color:#ff0000;} /* Меняет цвет текста абзацев на красный */

Но представьте, что нам нужно задать стиль только одному из абзацев <p></p> или группе этих абзацев, но не всем, как быть тогда?

В этом нам помогу классы(class) и идентификаторы(id). Как вы знаете из курса "HTML для новичков", основным тэгам HTML можно задать два атрибута class и id, первый из которых будет содержать в качестве свойств навзания класса и идентификатора соответственно. Если эти атрибуты заданы, то в CSS можно указать, чтобы стиль применялся конкретно к этому классу/идентификатору.

Чтобы стиль применялся к конкретному классу, перед названием класса нужно ставить точку, а перед названием идентификатора решетку. Чтобы вам было понятнее давайте разберем пример, у нас есть следующий код:

<p>Обычный текст без идентификаторов и классов</p>
<p class="redcolor">Обычный текст с классом - "redcolor"</p>
<p id="first">Обычный текст с идентификатором - "first"</p>
<p class="redcolor">Обычный текст с классом - "redcolor"</p>

Мы хотим, что бы обычные абзацы были черного цвета, абзац с идентификатором "first" - синего, а с классом "redcolor" - красным. Тогда CSS стиль для этого будет выглядеть следующим образом:

p {color:#000000;}
p#first {color:#0000FF;}
p.redcolor {color:#FF0000}

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

Стоит понимать, что указывая стили тем образом, что я описал на примере выше, стиль будет применятся исключительно ко всем тэгам <p> с этим классом, а что если потребуется написать стиль для разных тэгов с одним и тем же стилем? Для этого нужно убрать имя тэга из стилей и оставить только название класса с точкой, то же самое касается идентификатора.

Рассмотрим пример, у нас есть HTML код:

<p>Обычный текст без идентификаторов и классов</p>
<p class="redcolor">Обычный текст с классом - "red"</p>
<span class="redcolor">Обычный текст с классом - "red"</span>

Необходимо написать стиль, который будет окрашивать в красный шрифт содержимое всех тэгов у которых есть класс "redcolor", тогда стиль будет выглядить так:

.redcolor {color:#FF0000}

Тест

  1. Выберите селектор в виде класса:
    1. .romb
    2. #class
    3. <style>
  2. Каким стилем нельзя задать стиль для
    <p id="sotka">доброго пути</p>
    ?
    1. #sotka {COLOR:#FF0000;}
    2. p {COLOR:#FF0000;}
    3. P$SOTKA {COLOR:#FF0000;}
Ответы на тест

1. - a

2. - c

< >

Поиск по сайту

Топ 10 активных пользователей

  • Имя пользователя Баллы
  • gawk
    44.20
  • hr@proovelab
    15.00
  • Varvarka
    4.00
  • intuit89
    3.60
  • Akyla58
    3.00
  • AnnaOl
    3.00
  • dimasik_3557
    3.00
  • ErcardSa
    3.00
  • Galinamuh
    3.00
  • Hozephlof
    3.00
 

Рекламные ссылки

IHC

Пожертвования

icon donate

Yandex.Money: 410011571748395

Webmoney:

R362907776401 (Рубли)

Z410919458006 (Доллары)

ihc 468x60 1 1

Последнее с форума

intuit89 аватар
Мы можем: • Создание сайтов всех видов: промо-сайты, магазины, корпоративные. • Разработка нестанд...
Перейти в тему
intuit89 аватар
Здравствуйте! Наша команда занимается созданием и продвижением сайтов под ключ. [image] Предлагае...
Перейти в тему

Последние статьи

Javascript функции

Функции - одна из основных концепций языка JavaScript. При этом есть кардинальное отличие от многих языков программирования, в JS каждая функция сама по себе является объектом, а соответственно и манипулировать с ней можно разными способами:

Ссылка на телефон

В этой статье мы рассмотрим простой и обычный способ создания ссылки на телефон.

CPA сети 30.01.2017
CPA сети

Сегодня мы подробно рассмотрим тему зарабатка на своих проектах (т.е. это не обязательно сайты) при помощи CPA сетей.