50 вопросов по CSS. Собеседование на HTML верстальщика. Проверь свои знания!

В этом ролике разберем самые часто спрашиваемые вопросы по CSS. Подготовка к собеседованию на frontend разработчика по CSS. вопросы по CSS.

Поддержать меня и мой канал вы можете по ссылкам ниже.

[saweekmusic]

Привет всем! Я сделал тамйкоды, кому надо. Если не сложно, Автор, закрепи этот комент)

1. Свойство display - 0:31
2. Key frames - 1:53
3. Position - 2:40
4. Как бы вы реализовали кастомный чек бокс? - 5:25
5. Как от центровать блок по горизонтали и вертикали? - 6:17
6. Что делает box-sizing: border-box? - 6:38
7. Как обрабатывает WEB страницу браузер? - 7:24
8. Что такое inline стили? и их приоритет - 7:46
9. Чем отличается border от outline? - 8:14
10. Адаптивная верстка их ей методы - 9:02
11. Что такое БЭМ? - 9:18
12. Как при нажатии на ссылку открывать окно в новом окне? - 9:42
13. В чем различие между строчными и блочными элементами? - 9:58
14. Разница между marginи padding? - 10:14
15. Что такое семантические элементы и для чего они нужны? - 10:22
16. Свойство overflow, что делает и когда использовать? - 10:39
17. vh vw при указывании размеров - 11:06
18. Как визуально изменить курсор? - 11:27
19. Как изменить направление оси Flexbox контейнера? - 11:48
20. Из чего строится размер элемента? - 12:03
21. За что отвечает z-index? - 12:13
22. Какие виды input бывают? - 12:52
23. За что отвечает justify-content и align-tiems у flexbox контейнера? - 12:59
24. Как убрать маркер у списка? - 13:40
25. Что вы знаете о приоритете селекторов? - 13:56
26. Что такое псевдоклассы? - 14:13
27. Какие бывают значение у background-size? - 14:39
28. Какие псевдоэлементы вы знаете? - 15:19
29. Flexbox свойство, отвечающее за перенос элементов на новую строку при переполнении - 16:00
30. !important для чего используется? - 16:30
31. Разница между <script> <script async> <scrypt defer> - 16:37
32. Как увеличить в размере при наведении элемент, не сдвигая соседние - 17:39
33. Кратко о медиа запросах под мобильные приложения - 18:23
34. Какое свойство используется для перевода текста в заглавные или строчные буквы? - 19:00
35. Для чего рекомендуется использовать атрибуты data? - 19:20
36. Как стилизовать input для загрузки файлов? - 20:12
37. Что такое селектор атрибутов? - 20:51
38. Как изменить стили для кнопок с атрибутом disable? - 21:12
39. Как изменить стили для элемента span, который следует прямо за элементом input? - 21:31
40. С помощью какого селектора можно добавить стиль на каждый элемент на странице? - 21:55
41. Какое свойство позволяет вам спрятать элемент, но сохранить занимаемое им пространство на странице? - 22:13
42. Как сделать тень падающую от блока? - 22:51
43. Как сделать тень падающую от текста? - 23:24
44. Как повернуть блок на 45 градусов? - 23:44
45. Как сделать вращения по осям Х и Y заметными? - 24:14
46. Как сделать анимацию бесконечно повторяющейся? - 24:58
47. Для чего используются препроцессоры? - 25:06
48. Что такое миксины в препроцессорах? - 25:24
49. Что такое bootstrap? - 25:37

[kant]

14. Наоборот: padding - внутренние, margin - внешние.
А в остальном nice

[denisde]

Топовый контент, реально не каждый курс по css столько информации содержит 🤝. Спасибо.

[ipa_stor]

Кстати, может кто-нибудь объяснить, почему 50 вопросов на 26 мин оказались полезней некоторых курсов по CSS? :)))

[SKVoznyakz]

Всё коротко и по сути, как всегда. Восторг!

[meduza]

Спасибо большое! 50 вопросов на 26 мин оказались полезней некоторых курсов по CSS!

[aibekzhebegen]

я как будто курс по CSS прошел. Боже мой столько нового, аж конспектировал все подряд. очень просто и понятно объяснил гуманитарию))))

[Flamel]

хорош, спасибо) Про perspective было неожиданным открытием)

[CodeQuestRu]

Если углубляться еще дальше, то свойство display отвечает за 2 вещи:
1) Внешний тип отображение - какой бокс будет отрисован в нормальном потоке документа. Всего тут есть два варианта: блочный (block, table, flex, grid и т.д.), либо строчный (inline-block, inline-table, inline-flex, inline-grid и т.д.). Либо не отрисован вовсе (contents, none)
2) Внутренний контекст элемента - раскладка для дочерних элементов. Изначально она у всех flow - нормальный поток. И соответственно у table - табличный макет, у flex - гибкий макет, у grid - сеточный и т.д.
Это если вкратце.

[GalaMalareva]

Прекрасная напоминаловка для прохождения интервью!

[Alex-bxry]

8:11 - Если мы пропишем в стилях !important, то это будет иметь приоритет даже выше чем инлайновые стили, так что наивысший приоритет все-таки - !important

[m.efremova]

Супер! Узнала несколько совершенно новых моментов, например: perspective вместе с rotateX(), rotateY()

[vladyslavkozanchyn]

Аналогично с некоторыми :) Редко ставлю коменты, НО тут за проделанную работу, ПОНЯТНО всё и доступно, и очень полезно, спасибо.

[aidartimerbayev]

Доброе время суток. Очень полезный ролик. Спасибо. Не раз буду обращаться к этому ролику.

[dmitriystoyanov]

Супер, подборка просто самая базовая база. Постоянно что-то забывается, буду раз в месяц хотя бы смотреть этот видосик. Спасибо, мужик)

[ТисячорічнийВампір]

Мое уважение, очень быстро и толково.

[psychosis]

потрясающе освежает знания перед собеседованием, спасибо!

[littlegrownbeats]

Видео просто пушка! Один из лучших каналов!)

[crashcrash]

Про самое важное за короткий промежуток времени - здорово! Спасибо.

[crazyblackplay]

24:57 по моему свойство animation-duration определяет продолжительность анимации в секундах (s) и миллисекундах (ms), а как раз свойство animation-iteration-count определяет количество повторов анимации и соответственно указав значение infinite можно сделать анимацию бесконечной