Главная Случайная страница


Полезное:

Как сделать разговор полезным и приятным Как сделать объемную звезду своими руками Как сделать то, что делать не хочется? Как сделать погремушку Как сделать так чтобы женщины сами знакомились с вами Как сделать идею коммерческой Как сделать хорошую растяжку ног? Как сделать наш разум здоровым? Как сделать, чтобы люди обманывали меньше Вопрос 4. Как сделать так, чтобы вас уважали и ценили? Как сделать лучше себе и другим людям Как сделать свидание интересным?


Категории:

АрхитектураАстрономияБиологияГеографияГеологияИнформатикаИскусствоИсторияКулинарияКультураМаркетингМатематикаМедицинаМенеджментОхрана трудаПравоПроизводствоПсихологияРелигияСоциологияСпортТехникаФизикаФилософияХимияЭкологияЭкономикаЭлектроника






Селекторы псевдоклассов

⇐ ПредыдущаяСтр 23 из 65Следующая ⇒

Псевдоклассы позволяют применять различные стили к элементам, в зависимости от их состояния.

К примеру, к ссылке могут быть применены различные стили в зависимости от того, является ли ссылка еще не посещенной, находится ли в "фокусе" курсора.

Доступны следующие "состояния" элементов:

  • active – стиль применяется к элементу, активированному пользователем;
  • link – стиль применяется к непосещенным ссылкам;
  • focus – стиль применяется к элементу при получении им фокуса;
  • hover – стиль активизируется, когда курсор находится в пределах элемента;
  • visited – стиль применяется к посещенным гиперссылкам;
  • first- child – стиль применяется к первому дочернему элементу селектора.

Пример оформления стилей псевдоклассов:

a:link {color: red}

Селекторы псевдоэлементов

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

Доступны следующие псевдоэлементы:

  • after – позволяет добавить контент после указанного элемента;
  • before – позволяет добавить контент до указанного элемента;
  • first- letter – задает стиль для первого символа в тексте элемента;
  • first-line – задает стиль первой строки текста элемента.

Пример оформления:

li: before {content: "come content"}

Ключевые термины и определения

Псевдоклассы – это атрибуты, назначаемые строго к селекторам с намерением определить реакцию или состояние для данного селектора

Псевдоэлементы – это условные фиктивные элементы, которые являются частью существующих элементов или вводятся в документ дополнительно.

Краткие итоги

Данной лекцией мы заканчиваем знакомство с каскадными таблицами стилей. Нами были рассмотрены все базовые приемы работы со стилями.

Подбор стиля, который будет хорошо смотреться – задача нетривиальная и довольно трудоемкая, однако существует множество тематических сайтов с готовыми стилями, что значительно упрощает жизнь начинающему веб - разработчику.

Список материалов для самостоятельного изучения

  1. http://www.w3.org/TR/CSS2/selector.html#type-selectors
  2. http://www.w3.org/TR/selectors/
  3. http://www.alfafreedesign.ru/selektor-css.html
  4. http://vgi.volsu.ru:8000/~Vladimir.Dronov/books/html5_css3_web2.0_2.html

 


⇐ Предыдущая18192021222324252627Следующая ⇒





Date: 2015-07-22; view: 460; Нарушение авторских прав


mydocx.ru - 2015-2024 year. (0.005 sec.) Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав - Пожаловаться на публикацию