Яндекс.Метрика

Дизайн-журнал №1. Актуальная информация для дизайнеров, веб дизайнеров, программистов и разработчиков сайтов.

Использование селекторов псевдоклассов

9 февраля 2018 | Опубликовано в css | 12 Комментариев »

Селекторы псевдоклассов влияют на элементы в определенных состояниях, например, запись a:hover контролирует внешний вид ссылок в момент прикосновения к ним на мобильном устройстве или при наведении указателя мыши на компьютере. В отличие от селекторов псевдоэлемента, которые контролируют внешний вид части содержимого элемента, такой как первая строка или первая буква абзаца.

 

 


В таблице ниже находятся все текущие селекторы псевдоклассов в CSS, у некоторых из которых есть ссылки на дополнительную информацию:

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

Селектор псевдокласса Цель
:link Контролирует внешний вид непосещенных ссылок. Сильно связан с элементом ссылки, до той степени, что элемент ссылки, использованный без других псевдоселекторов перед заданием стилей, контролирует то же самое.
:visited Контролирует внешний вид посещенных ссылок. По соображениям безопасности существует много ограничений на применение стилей.
:hover Контролирует внешний вил элемента при наведении на него указателя мыши или другого указывающего устройства. Хотя он сильно связан с элементов ссылки, в CSS такая связь не указана. В современных версиях браузеров этот псевдокласс может быть применен к любому элементу, например к изображению, следующим образом: img:hover.
:active Контролирует внешний вид содержимого, пока пользователь нажимает на него, т. е. между моментами, когда кнопка мыши нажимается и отпускается. Используется редко, так как эффект обычно очень кратковременный.
:first-child Выбирает элемент первого потомка из последовательности разметки. Например, запись ul li:first-child задаст стили для первого элемента списка в любом ненумерованном списке.
:last-child Выбирает элемент последнего потомка из последовательности разметки.
:nth-child(n) Выбирает каждый элемент или элементы потомка из последовательности разметки, который соответствует (n), где n может быть словом, таким как odd (нечетный) или even (четный), числом, или математическим выражением.
:nth-of-type(n) Выбирает каждое n-ное появление определенного элемента.
:focus Задает стили ссылкам, которые были выбраны с помощью клавиатуры и выбранным элементам форм, таким как поля ввода.
:only-child Выбирает элемент, только если он единственный потомок родительского элемента.
:first-of-type Выбирает первый элемент заданного типа.
:last-of-type Выбирает последний элемент заданного типа.
:only-of-type Выбирает элемент, только если он единственный потомок заданного типа родительского элемента.
:nth-last-child(n) Отсчитывает назад от конца в группе потомков.
:nth-last-of-type(n) Отсчитывает назад от конца в группе потомков заданного типа.
:not(S) Соответствует элементам, которые не (S).
:valid Состояние элемента форм с содержимым, которое считается соответствующим определенной схеме символов и чисел.
:invalid Состояние элемента форм с содержимым, которое считается несоответствующим.
:checked Задает свойства элементам форм, которые выбраны, таким как радиокнопки и переключатели-флажки.

Обратите внимание на то, что псевдоселекторы могут быть использованы вместе, например: a:visited:hover.

Автор урока Dudley Storey

Перевод — Дежурка

Смотрите также:




Комментарии

  1. Merziuz
    Thumb up Thumb down 0

    Wgp00j pills2sale.com viagra online

    Ответить

  2. Adolph
    Thumb up Thumb down 0

    I'm afraid that number's ex-directory buy metronidazole cream canada InformationWeek encourages readers to engage in spirited, healthy debate, including taking us to task. However, InformationWeek moderates all comments posted to our site, and reserves the right to modify or remove any content that it determines to be derogatory, offensive, inflammatory, vulgar, irrelevant/off-topic, racist or obvious marketing/SPAM. InformationWeek further reserves the right to disable the profile of any commenter participating in said activities.

    Ответить

  3. Deadman
    Thumb up Thumb down 0

    What university do you go to? harga obat amlodipine 10 mg Soon after Faure gave Cuban the «confidential information» on June 28, 2004, Cuban demanded more details on the new stock offering. Did the offering, for example, include discounts for current shareholders, Cuban asked. Faure connected Cuban to an investment banker who was responsible for selling the new stock. Only 1 minute after Cuban's conversation with the investment banker, Cuban called his broker to order an immediate sale of his nearly $8 million in stock. The broker managed to sell 10,000 shares that afternoon and sold the remaining shares the next day at an average price of $13.29 per share.

    Ответить

  4. Raymundo
    Thumb up Thumb down 0

    Please wait vigora tablet for female in hindi ** JSW Steel, India's third-largest steelmaker,has expressed interest in buying British steel trader Stemcor'sIndian iron ore assets, joining at least three other interestedparties, two sources at the companies said.

    Ответить

  5. Miquel
    Thumb up Thumb down 0

    My battery's about to run out viagra product reviews "In the event of a large earthquake, oftentimes it's not just one break in the ground, it's spread out over some distance, " Catchings said. "You'd kind of like to know where all these things are if you really want to understand the hazard. "

    Ответить

  6. Lynwood
    Thumb up Thumb down 0

    I've just started at cialis dosage 5mg or 10mg Microsoft's plan to «win in this devices and services era» suggests that the firm may not be only going after Sony's PlayStation 4 with its upcoming Xbox One, but other rival platforms and services, too.

    Ответить

  7. Claude
    Thumb up Thumb down 0

    What university do you go to? cataflam pro aerosol com 85 ml "By coming so close Greenpeace could have damaged the base of the platform. When they threw up their equipment they could easily have hit somebody. Or they might have ruptured one of the pressurised pipes and caused a diesel spill. "

    Ответить

  8. Nicholas
    Thumb up Thumb down 0

    Gloomy tales ultherapy before and after stomach His staff are not too concerned about the extra day-to-daydemands of ECB supervision. Two sources familiar with thesituation told Reuters that German supervisor Baffin was alreadyholding a daily liquidity call with HASH.

    Ответить

  9. Barrett
    Thumb up Thumb down 0

    I need to charge up my phone cursos financiados iefp 2019 coimbra A 2007 study found that when healthy participants were deprived of sleep, they had greater brain activity after viewing upsetting images than their well-rested counterparts, which is similar to the reaction that depressed patients have, noted one of the study authors.

    Ответить

  10. Russel
    Thumb up Thumb down 0

    We went to university together bimatoprost ophthalmic solution 0.03 buy canada "If you look at past years there has been a narrowing of thegap by this stage in the negotiations and we have not seen thatyet, " said Charmane Russell, a spokeswoman for the goldproducers which include AngloGold Ashanti, Gold Fields, Harmony and Sibanye Gold.

    Ответить

  11. Winford
    Thumb up Thumb down 0

    What line of work are you in? clomiphene cycle bodybuilding In terms of the effects of female genital mutilation on women you find that depending on the more serious form you would have issues to deal with; menstruation, urination but also sexual intercourse. But more importantly what we don't tend to seem to be addressing is the mental health-related issues and trauma associated. People talk about the short-term and the long-term consequences of female genital mutilation but the reality is that there are some people who would tell you that they do not have any health-related problems, and others who would have a lot of severe problems. In the UK we are finding that type one and type two tend to have a lot more psychosexual problems.

    Ответить

  12. lstzsi
    Thumb up Thumb down 0

    tHpMhG wcytpoahkvkc, [url=http://ybepxnntuljf.com/]ybepxnntuljf[/url], [link=http://iizwqmefrhoi.com/]iizwqmefrhoi[/link], mimpzufjjhqb.com

    Ответить

Оставить ответ


8 − один =

Вставить изображение