Собеседование Frontend (CSS) - вопросы и подготовка

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

Вы можете начать изучение этого набора. Вам будет отправлено 132 сообщений для повторения каждой карточки несколько раз в соответствие с кривой забывания.

Узнайте больше о методе интервального повторения.

Запланируйте ежедневные повторения карточек на случай если вам нужно запомнить за короткий срок или довести эти знания до автоматического уровня.

Узнайте больше о ежедневных практиках.

Создать

Схлопывание отступов

Что такое схлопывание отступов?

1/33

Блочная модель

Что такое блочная модель CSS?

2/33

Позиционирование

Какие типы позиционирования есть в CSS?

3/33

Селекторы

Что такое селектор и какие селекторы существуют?

4/33

Специфичность селекторов

Что такое специфичность селектора? Как считать веса селекторов?

5/33

Центрирование блоков

Какие есть способы центрирования блочного контента?

6/33

CSS препроцессоры

Что такое CSS препроцессоры?

7/33

reset и normalize: разница

Разница между reset и normalize?

8/33

Медиа-запросы в CSS

Что такое медиа запросы в CSS?

9/33

translate() v.s. Абсолютное позиционирования

В каких случаях использовать функцию translate() вместо абсолютного позиционирования? И почему?

10/33

БЭМ (Block-Element-Modifier)

Что такое БЭМ (Block-Element-Modifier) методология и какие преимущества она предоставляет?

11/33

Flexbox: что это и основные свойства

Что такое Flexbox и какие основные свойства Flexbox контейнера и элементов?

12/33

CSS Grid: система сеток

Как работает система сеток в CSS Grid?

13/33

CSS: создание анимации

Каким образом можно создать анимацию с использованием CSS?

14/33

CSS-переменные (кастомные свойства)

Что такое CSS-переменные (кастомные свойства) и какие преимущества они предоставляют?

15/33

Резиновый vs адаптивный дизайн

Что такое «резиновый» и «адаптивный» дизайн? В чем разница между ними?

16/33

z-index: как работает стек слоёв

Как работает свойство z-index и как управлять стеком z-индексов?

17/33

Рендеринговая цепочка и CSS

Что такое "рендеринговая цепочка" и как CSS влияет на процесс рендеринга в браузере?

18/33

Reflow и Repaint в CSS

Что такое repaint и reflow в контексте CSS и как они влияют на производительность?

19/33

Вендорные префиксы в CSS

Что такое «вендорные префиксы» в CSS и зачем они используются?

20/33

CSS и доступность: ключевые механизмы

Какие механизмы доступности (accessibility) следует учитывать при разработке с использованием CSS?

21/33

Критический путь рендеринга и CSS

Что такое «критический путь рендеринга» и как CSS может влиять на него?

22/33

Наследование в CSS

Как работает механизм наследования в CSS? Какие свойства наследуются, а какие нет?

23/33

Ретинизация изображений

Что такое «ретинизация» изображений и как связано с CSS?

24/33

rem в CSS: как работает и преимущества перед px и em

Как работает система единиц измерения rem в CSS? В чем её преимущества перед px и em?

25/33

CSS фильтры

Как работают фильтры в CSS и какие виды фильтров существуют?

26/33

CSS‑перехватчики (CSS Houdini)

Что такое «CSS-перехватчики» (CSS Houdini) и какие API они предоставляют для расширения CSS?

27/33

box-sizing в CSS

Что такое "границы" (box sizing) в CSS и какие значения они могут иметь?

28/33

will-change

Как работает свойство will-change и в каких случаях оно может быть полезным?

29/33

CSS clip-path

Как работает свойство clip-path и как оно может быть использовано для создания необычных форм элементов?

30/33

Комбинаторы соседства в CSS (+ и ~)

Что такое «комбинаторы соседства» в CSS и как их применять для стилизации элементов на одном уровне вложенности?

31/33

«Контентные контроли» в CSS

Что такое «контентные контроли» (content control) в CSS и как они могут использоваться для создания интерактивных элементов?

32/33

Гибридные сетки в CSS

Что такое «гибридные сетки» (hybrid grids) в CSS и как они могут быть использованы для создания сложных макетов?

33/33