СКРИПТЫ
ТЕГИ:
php (322)
js (242)
html (146)
css (127)
html tags (62)
js tag (56)
jquery (42)
text (37)
js method (36)
php array (33)
js date (33)
form html (30)
fonts (30)
online (27)
link (26)
Показать еще :
ruweb.net (25)
foto (22)
php file (20)
atom (20)
forum (19)
input (18)
hosting (18)
svg (18)
php date (17)
board (16)
php time (16)
html book (16)
color (15)
js events (14)
js url (14)
js time (14)
img (13)
htaccess (13)
osclass (13)
info (13)
notepad (13)
select (13)
php path (12)
keyboard (12)
table (12)
знак (12)
php img (12)
dw block (12)
download (12)
jsphp (11)
form (11)
icon (11)
yandex (10)
js delete (10)
mouse (10)
hover (9)
dosite (8)
php url (7)
browser (7)
cookie (7)
comment (7)
php get (6)
iframe (6)
list (6)
canvas (6)
mysql (6)
click (6)
tag a (5)
adminka (5)
value (5)
reg.ru (5)
search (5)
js math (5)
mb (5)
chart (5)
ftp (5)
year (5)
heading (5)
js id (5)
нок (4)
php var (4)
xml (4)
scandir (4)
ssl (4)
week (4)
day (4)
base64 (4)
bbcode (4)
js form (4)
task (4)
month (4)
console (4)
symbols (4)
pages (4)
vk (4)
submit (4)
https (3)
numbers (3)
js post (3)
js hash (3)
money (3)
vs code (3)
domen (3)
куб (3)
line (3)
captcha (3)
ucoz (3)
padding (3)
js img (3)
js vars (2)
рся (2)
youtube (2)
video (2)
sitemap (2)
tag hr (2)
prompt (2)
arrows (2)
details (2)
seo (2)
height (2)
google (2)
qr kod (2)
counter (2)
typeof (2)
speed (1)
rutube (1)
windows (1)
game (1)
header (1)
smile (1)
archive (1)
cursor (1)
jino (1)
scroll (1)
нод (1)

Список всех Селекторов в CSS

"Селектор CSS" - что такое селектор CSS? Примеры селекторов. Список всех селекторов, которые существуют!

Подробно о селекторах в css

  1. Что такое селектор?
  2. Таблица всех селекторов

  1. Что такое селектор?

    Селектор - это часть CSS-правила, которая сообщает браузеру, к какому элементу (или элементам) веб-страницы будет применён стиль.

    Термин селектор может относиться к простому селектору (simple selector), составному селектору (compound selector), сложному селектору (complex selector) или списку селекторов.

    Список всех селекторов

    *

    .class

    #id

    tag

    X, Y

    X Y

    Х > Y

    Х ~ Y

    Х + Y

    a:link, a:visited, a:hover, a:active, a:focus

    [attr]

    [attr = value]

    [attr *= value]

    [attr ^= value]

    [attr $= value]

    [attr ~= value]

    [attr |= value]

    :target

    :checked

    :default

    :disabled

    :enabled

    :empty

    ::before

    ::after

    :focus

    :focus-visible

    :focus-within

    :hover

    :not(selector)

    ::first-line, ::first-letter
    :nth-child(n)

    :nth-last-child(n)

    :nth-of-type(n)

    :nth-last-of-type(n)

    :first-child

    :last-child

    :first-of-type, :last-of-type

    :only-child

    :not(:only-child)

    :only-of-type


  2. Таблица всех селекторов

    В таблице приведены все селекторы с примером и описанием:

    Селектор Пример Описание примера
    * * Все элементы.
    #id #firstname Элемент с id="firstname".
    .class .intro Все элементы с class="intro".
    .class1.class2 .name1.name2 Все элементы с class="name1 name2".
    .class1 .class2 .name1 .name2 Все элементы с class="name2" у которых родитель с class="name1".
    tag p Все <p> элементы.
    tag.class p.intro Все <p> элементы с class="intro".
    tag, tag div, p Все <div> и все <p> элементы.
    tag tag div p Все <p> внутри всех <div>.
    tag > tag div > p Все <p> прямой родитель которых <div>.
    tag + tag div + p <p> который находятся сразу после <div>.
    tag ~ tag div ~ p Все <p> которые находятся после <div>.
    [attribute] [target] Все элементы с target="что-либо".
    [attribute = value] [target=_blank] Все элементы с target="_blank".
    [attribute ^= value] a[href^="https"] Каждый <a> атрибут href которого начинается с "https".
    [attribute $= value] a[href$=".pdf"] Каждый <a> атрибут href которого заканчивается ".pdf".
    [attribute *= value] a[href*="w3schools"] Каждый <a> атрибут href которого содержит подстроку "w3schools".
    [attribute ~= value] [title~=flower] Все элементы в атрибуте title которых есть слово "flower".
    [attribute |= value] [lang|=en] Все элементы атрибут lang которых начинается с "en".
    :active a:active Активная ссылка.
    ::after p::after Вставляет псевод-элемент в начале каждого <p> элемента.
    ::before p::before Вставляет псевод-элемент в конце каждого <p> элемента.
    :checked input:checked Все выбранные <input type="checkbox"> элементы.
    :default input:default Все <input> элементы.
    :disabled input:disabled Все <input disabled> элементы.
    :empty p:empty Все пустые <p>, в которых нет пробелом, текста или других элементов.
    :enabled input:enabled Все активные (не disabled) элементы <input>.
    :first-child p:first-child Первый элемент в списке родительского элемента.
    :first-of-type p:first-of-type Первый <p> элемент в списке родительского элемента.
    ::first-letter p::first-letter Первая буква каждого <p> элемента.
    ::first-line p::first-line Первая линия каждого <p> элемента.
    :focus input:focus <input> в котором находится курсор.
    :focus-visible a:focus-visible Фокус сработает, только если на кнопку перешли с клавиатуры через TAB.
    :focus-within div:focus-within Сработает на блоке, когда его внутренний элемент находится в фокусе.
    :hover a:hover Сслыка на которую наведена мышка.
    :in-range input:in-range Все <input> со значением в пределах указанного диапазона.
    :indeterminate input:indeterminate Все <input> в статусе indeterminate.
    :invalid input:invalid Все <input> с недопустимым значением.
    :lang(language) p:lang(it) Все <p> с lang="it".
    :last-child p:last-child Последний элемент в списке родительского элемента.
    :last-of-type p:last-of-type Последний <p> в списке родительского элемента.
    :link a:link Все непосещенные ссылки.
    :not(selector) :not(p) Все не <p> элементы.
    :not(:only-child) div:not(:only-child) Все <div> внутри которых больше одного элемента.
    :nth-child(n) p:nth-child(2) Второй элемент в списке родительского элемента.
    :nth-of-type(n) p:nth-of-type(2) Второй <p> в списке родительского элемента.
    :nth-last-child(n) p:nth-last-child(2) Второй элемент в списке родительского элемента (счет идет с конца).
    :nth-last-of-type(n) p:nth-last-of-type(2) Второй <p> в списке родительского элемента (счет идет с конца).
    :only-child p:only-child Единственный <p> у родителя (других элементов быть не может).
    :only-of-type p:only-of-type Один <p> у родителя (других элементы могут быть).
    :optional input:optional Все <input> у которых нет артибута "required".
    :required input:required Все <input> у которых указан атрибут "required".
    :out-of-range input:out-of-range Все <input> со значением выходящим за указанный рэндж.
    ::placeholder input::placeholder Все <input> у которых указан атрибут "placeholder".
    :read-only input:read-only Все <input> у которых указан атрибут "readonly".
    :read-write input:read-write Все <input> у которых не указан атрибут "readonly".
    :root :root Корен документа.
    ::selection ::selection Выберет текущее выделение текста мышкой.
    :target #news:target Выберет элемент с id="news" когда к нему пришил по клику.
    :valid input:valid Все <input> с валидным значением.
    :visited a:visited Все посещенные ссылки.

Можете не благодарить, лучше помогите!
Теги :
css селекторы
css селектор элемента
селекторы классов css
html css селекторы
css селектор по атрибуту
css селектор тега
соседний селектор css
css правила селекторов
селекторы стилей css
виды селекторов css
правильный css селектор
селекторы список
css селекторы список
Еще никто не прокомментировал! COMMENTS+   BBcode
Подписаться + =

Счетчик в график :

Построение гравиков
Основа для графика : счетчик посещаемости.
На отдельной : странице.
dwweb.ru есть здесь:
Последние комментарии :
Марат :
14.03.2023 21:07
Так... это когда было то... в 2018 году... мне не нравится(не нравилось), как поиск по файлам... как-то коряво было…
подробнее.
Moubrey :
14.03.2023 20:52
Их там два можно поставить, еще и по бокам, а в них еще друге окна станут вкладками, обычный проводник и…
подробнее.
Марат :
26.02.2023 12:20
Спасибо за внимательность!
подробнее.
V :
26.02.2023 11:49
В массиве месяцев пропущен октябрь!
подробнее.
Марат :
02.02.2023 10:48
Я не знаю, что это ... Такое понятие - "определена"... я не понимаю, что такое... есть такая фигня в Js, там, бывают…
подробнее.
Артур :
02.02.2023 06:51
При копировании всего кода из 3 главы "Вывод всех файлов из папки ссылками на них", при выполнении скрипта…
подробнее.
ruweb
Страница загружена за : 0.022454 секунд. Подробнее