Div блогының id="main" және class="card" атрибуттары бар. Оның ішінде үш абзац орналасқан: біріншісі — class="note" атрибуты бар p; екіншісі — class="note" және id="x" атрибуттары бар p; үшіншісі — style="color: black" атрибуты бар p. Қосылған стильдер кестесінде ережелер мына ретпен жазылған:
p { color: green; }
.card p { color: blue; }
.note { color: red; }
#main p { color: orange; }
p#x { color: purple; }
Бірінші, екінші және үшінші абзацтың мәтіні сәйкесінше қандай түспен көрсетіледі?
Жауап пен талдауды көрсетуЖауап пен талдауды жасыру
Дұрыс жауап
- Dқызғылт сары, күлгін, қара
Талдау
Ең жоғары басымдығы (специфичность) бар ереже жеңеді: ішкі стиль кез келген селектордан күшті, одан кейін идентификатор, сынып, тег келеді. Басымдық тең болса, кейінірек жазылған ереже қолданылады. Бірінші абзац: «p» (0,0,1), «.card p» (0,1,1), «.note» (0,1,0), «#main p» (1,0,1); ең жоғарысы «#main p», сондықтан мәтін қызғылт сары. Екінші абзац: сол ережелер және «p#x» (1,0,1) сәйкес келеді; «#main p» мен «p#x» басымдығы тең, сондықтан кейін жазылған «p#x» қолданылады, мәтін күлгін. Үшінші абзац: style атрибуты (ішкі стиль) кестедегі барлық ережеден күшті, сондықтан мәтін қара. Дұрыс жауап: «қызғылт сары, күлгін, қара».