Самые частые вопросы про CSS на собеседовании: адаптивность, flex, grid, position, z-index, шрифты.
Что такое специфичность у селекторов в CSS?
Объясните, что такое специфичность у селекторов в CSS и как она влияет на применяемые стили. Как рассчитывается уровень специфичности и что делать в случае конфликта стилей?Junior, Trainee
Что такое псевдоклассы в CSS?
Объясните, что такое псевдоклассы в CSS и для чего они используются. Приведите примеры часто используемых псевдоклассов и в каких ситуациях они применяются.Junior, Trainee
Как можно стилизовать SVG в CSS?
Объясните, как в CSS можно стилизовать элементы SVG. Какие возможности стилизации доступны, и как они могут применяться к векторной графике?Junior, Trainee
Что такое display: grid и как его использовать?
Расскажите, что представляет собой CSS-свойство display: grid, как оно помогает создавать сложные макеты и какие ключевые концепции необходимо понимать для его использования.Junior, Trainee
Что такое псевдоэлементы в CSS?
Определите, что такое псевдоэлементы в CSS и в чем их отличие от псевдоклассов. Приведите примеры часто используемых псевдоэлементов и объясните их назначение.Junior, Trainee
Как можно сделать анимации в CSS?
Опишите, какие способы существуют для создания анимаций в CSS. Укажите, какие CSS свойства используются для задания анимаций, и как они могут применяться для создания плавных переходов и эффектов.Junior, Trainee
Как задать стиль первому элементу в div'e в CSS?
Объясните, как с помощью CSS можно применить стили только к первому элементу внутри блока div. В каких ситуациях это может быть полезно?Junior, Trainee
Как отцентрировать блок с помощью CSS?
Расскажите, какие существуют методы центрирования блоков в CSS, как они работают и в каких ситуациях применяются. Укажите, как можно выровнять блок по горизонтали и вертикали.Junior, Trainee
Какие способы центрирования элементов по горизонтали и вертикали знаете?
Опишите различные методы центрирования элементов в CSS по горизонтали и вертикали, как они работают и в каких случаях их лучше использовать.Junior, Trainee
Как задать стиль последнему элементу в div'e в CSS?
Объясните, как с помощью CSS можно применить стили только к последнему элементу внутри блока div. В каких ситуациях это может быть полезно?Junior, Trainee
Что такое display: flex и как его использовать?
Объясните, что представляет собой CSS-свойство display: flex, для чего оно используется и как оно помогает управлять расположением элементов внутри контейнера.Junior, Trainee
Как перекрыть стиль с самой высокой специфичностью в CSS?
Как можно в CSS переопределить стили, даже если они заданы с самой высокой специфичностью? Какие подходы или методы можно использовать в этом случае?Junior, Trainee
Как можно зациклить анимацию в CSS?
Опишите, как с помощью CSS можно зациклить анимацию, чтобы она повторялась бесконечно. Какие свойства и значения для этого используются?Junior, Trainee
Что такое медиазапросы в CSS?
Опишите, что такое медиазапросы в CSS, как они работают и как их можно использовать для создания адаптивных веб-страниц.Junior, Trainee
Что такое reset.css и normalize.css, и в чем разница в CSS?
Объясните, что такое reset.css и normalize.css, и в чем заключается их основное различие. Почему их используют в веб-разработке?Junior
Что такое блочная модель CSS?
Опишите, что такое блочная модель в CSS и как она влияет на отображение элементов на веб-странице. Укажите, какие части составляют блочную модель и как они взаимодействуют между собой.Junior
Что такое CSS-препроцессоры и зачем они нужны?
Объясните, что такое CSS-препроцессоры, как они работают и в чем их преимущества при разработке стилей для веб-страниц.Junior
В чем разница между единицами измерения px, em, rem в CSS?
Объясните, какие существуют единицы измерения в CSS, такие как px, em и rem, и в чем заключается разница между ними. Укажите, как эти единицы влияют на размеры элементов и их адаптацию к различным устройствам и экранам.Junior
Как можно подключить внешний шрифт в CSS?
Объясните, как в CSS можно подключить внешний шрифт с использованием @font-face или других методов. Какие шаги нужно выполнить, чтобы шрифт корректно отображался на веб-странице?Junior
Зачем нужны префиксы для некоторых CSS-свойств (-webkit-, -moz-)?
Объясните, для чего используются префиксы, такие как -webkit- и -moz-, перед некоторыми CSS-свойствами и как это связано с поддержкой браузерами.Middle, Junior
Как можно упростить написание кросс-браузерных стилей?
Расскажите, какие подходы и инструменты могут помочь в написании кросс-браузерных стилей в CSS и как обеспечить корректное отображение страниц в разных браузерах.Middle, Junior
Как задать цвет текста плейсхолдера у инпута в CSS?
Опишите, как в CSS можно изменить цвет текста, отображаемого в поле ввода (input) в качестве плейсхолдера. Какие псевдоклассы или псевдоэлементы для этого используются?Middle, Junior
Что такое БЭМ (BEM) в CSS?
Расскажите, что такое методология БЭМ (BEM) в CSS, как она используется для организации кода и какие правила она предполагает для наименования классов.Middle, Junior
Какие бывают значения у свойства position в CSS?
Опишите различные значения свойства position в CSS. В каких ситуациях и для каких целей они могут применяться при верстке веб-страниц?Middle, Junior
Для чего нужен box-sizing: border-box в CSS?
Объясните, как работает свойство box-sizing в CSS и зачем нужно использовать значение border-box. Укажите, как это свойство влияет на размеры элементов и вычисление их ширины и высоты в макете.Middle, Junior
В чем отличие CSS переменных от SCSS/SASS/LESS переменных?
Расскажите, в чем заключается разница между использованием переменных в чистом CSS и переменных, предоставляемых препроцессорами вроде SCSS, SASS или LESS. Объясните, как отличаются подходы к определению и применению этих переменных.Middle, Junior
Что такое контекст наложения и z-index в CSS?
Объясните, что такое контекст наложения в CSS и как он связан с использованием свойства z-index. Как формируется порядок наложения элементов на странице?Middle, Junior
В чем разница между display: none, opacity: 0 и visibility: hidden в CSS?
Объясните, в чем разница между использованием `display: none`, `opacity: 0` и `visibility: hidden` для скрытия элементов в CSS. Как эти свойства влияют на размещение элементов на странице и их взаимодействие с пользователем?Middle
Какое значение по умолчанию имеет свойство position в CSS?
Опишите, какое значение по умолчанию присваивается свойству position в CSS и что это означает для позиционирования элементов на странице.Middle
Какие этапы отрисовки страницы есть в браузере?
Опишите основные этапы отрисовки страницы в браузере. Как браузер обрабатывает HTML, CSS и JavaScript, чтобы превратить их в визуальное представление страницы?Senior, Middle
Что такое reflow и repaint при отрисовке в браузере?
Объясните, что такое процессы reflow и repaint в браузере. Как изменения в DOM или CSS влияют на эти процессы и в каких ситуациях они могут быть вызваны?Senior, Middle
Какие CSS свойства обрабатываются на GPU?
Расскажите, какие CSS свойства обрабатываются с помощью GPU, и как это влияет на производительность рендеринга. Объясните, когда и почему стоит оптимизировать работу с этими свойствами.Senior, Middle