❌ Не пиши CSS через запятую ✅ Используй :where()

Подписаться 102 тыс.

Просмотров 16 тыс.

50% 1

🔥 22 апреля стартует продвинутый курс по вёрстке - frontendblok.com/courses/adva...
⚡️ Скидка 30% на любой тариф до конца недели
Демо - codepen.io/anna_blok/pen/ZEZj...
Boosty «‎Мидл на прокачку» - boosty.to/annblok/purchase/75...
Практика на закрепление материала из видео:
boosty.to/annblok/posts/8a5d7...
Таймкоды:
00:00 Вступление
00:14 Продвинутый курс
00:57 Разметка HTML
01:43 Пример 1
03:19 Пример 2
04:11 Пример 3
07:31 Boosty
08:02 Пример 4
10:36 Поддержка
🔵 Telegram - t.me/frontendblok
🔵 Чат Telegram - t.me/frontendblokchat
🔵 Instagram - / annblok
🔵 TikTok - / annblok_webdev
🔵 Дзен - zen.yandex.ru/annblok
🔵 ВК - tpverstak
🔴 Обучение - frontendblok.com

Развлечения

Опубликовано:

1 июн 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 56

@annblok_webdev Месяц назад

На Boosty я опубликовала практику, чтобы закрепить материал из этого видео на практике. Доступно подписчикам тарифа «‎Мидл на прокачку» - boosty.to/annblok/purchase/751559

@tetyana5295 Месяц назад

просто удивительно, как вы, такая хорошенькая и молодая девушка, уже так отлично разбираетесь в сложных программах

@yurok1991 Месяц назад

Спасибо! Буду ждать видео сравнение про :where() и :is()

@olegivanov6231 Месяц назад

Ускорю процесс. Разница в специфичности, вот и всё

@user-ke3nn4fr4z Месяц назад

Так много нюансов узнаю про CSS как говорит век живи - век учись

@user-wn9tk3uk5u Месяц назад

Отличное видео! Спасибо за подсказку о использовании :where() в CSS. Буду использовать этот метод, чтобы избежать лишних запятых и сделать код более понятным и читаемым. Спасибо за полезный совет!

@user-wy4zl9ue4u Месяц назад

Подробно и доступно, думаю, стоит записаться на продвинутый курс, если и там будут всё настолько понятно объяснять.

@user-hl3do4gt9x Месяц назад

Глубина ваших знаний и умение просто и доходчиво объяснить потрясает!

@progerlife6690 Месяц назад

Годнота спасибо!

@user-oc9ho6kv1s Месяц назад

Если у вас маленький сайтик, то псевдоклассы возможно удобнее. Но надо помнить, что они медленнее чем простые селекторы. Поэтому для больших проектов предпочтительнее использовать псевдоклассы по минимуму. Впрочем при использовании UI-фреймворков типа React, Vue, Svelte и т.п. необходимость в псевдоклассах практически отпадает. Учить это всё можно лишь из спортивного интереса.

@-minus140 Месяц назад

Интересно, ты откуда такой умный вылез?

@user-mf9kn8wn4p Месяц назад

Все по делу сказал )

@user-FedorVorobyev Месяц назад

Да, это просто чудесно, что наконец-то стартует продвинутый курс по вёрстке, будем его изучать. Спасибо)

@JRs_Owners Месяц назад

Спасибо за полезные уроки! Очень хорошо объяснили, если честно)

@user-hs7im8su7g Месяц назад

Именно так? Я чесно говоря и не знал. спасибо.

@user-gq9bh3si4y Месяц назад

Отличное видео, много интересного услышал, хорошо что вы создали такой канал

@user-xg4ji5vd1r Месяц назад

Это все интересно и полезно, спасибо за советы.

@marinagor Месяц назад

уго,я не знала) круто что поделились с нами) очень полезно

@farmlingarchontas2216 Месяц назад

Хорошие примеры. Мне очень понравилось. Лайк без всяких сомнений.

@user-ww7iq8eh2l Месяц назад

Подписалась на ваш канал, очень полезные и крутые видео 😊

@LostInspector Месяц назад

Только начал думать об изучении HTML и CSS)

@oxanaluzenko4709 Месяц назад

Такая симпатичная девушка и так хорошо разбирается в таких вещах)) браво.

@Serehajsss Месяц назад

Многое упускаю и не использую в ксс, пора это исправлять!

@CityGorsk Месяц назад

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

@user-ek1sz6ie4k Месяц назад

Це дуже важлива інформація. Тепер буду знати.

@cooperanderson8651 Месяц назад

Довольно интересные новинки в css. Интересно, на сколько они приживутся на практике?

@AniMag59 Месяц назад

Интересный псевдокласс. Но на практике в реальном проекте он скорее будет мешать. Конечно так выглядит красивее и лаконичнее, но при поддержке и развитии проекта неизбежны правки которые зачастую выполняет не тот кто изначально занимался проектом. И как следствие все эти крутые сокращения файла стилей будут посланы в далёкое эротическое и будут перекрываться новыми необходимыми в данный момент. Это мне напоминает сокращённые записи в PHP. То есть экономия несколько килобайт ради худшей читаемости кода.

@Alexandr_Zavgorodniy Месяц назад

Все таки нужно было еще рассказать, что селекторы указанные в :where() имеют нулевую специфичность. И при таком коде: _p {_ _color: red;_ _}_ _:where(footer) :where(p) {_ _color: green;_ _}_ текст параграфов в футере будет красным, а не зеленым.

@annblok_webdev Месяц назад

Об этом расскажу в следующем видео про :where() и :is()

@Alex-mi2ij Месяц назад

Вообще не знаю ничего из этого)) Придётся изучать всё с самого начала...

@code-art-school Месяц назад

Интересно, но не особо вяжется с методологиями. Ни с БЭМ, ни с атомарной

@alexandergrigorenko4977 Месяц назад

девушка программист с красивыми глазами - мечта холостяка

@-minus140 Месяц назад

Ты таких видел когда ни будь?

@Agent-D Месяц назад

Where are you from ? . . .

@Serehajsss Месяц назад

Ukropia

@vanzo16 Месяц назад

404 лайк. Символично.

@kanz1t Месяц назад

Всё круто, но IE просто идет лесом_))))))

@annblok_webdev Месяц назад

Смысл переживать за IE, если от его поддержки даже сам Microsoft отказался несколько лет назад

@Virisound Месяц назад

"Такое себе". Фактически не сокращает код. Толку то.

@WERWOLION Месяц назад

Хорошо когда на сайте H1 в футере , хедере и ещё в каком то блоке. Это православно!

@Serehajsss Месяц назад

Сразу видно что не шаришь за семантику. Мне тебя жаль!

@WERWOLION Месяц назад

@@Serehajsss ты видео нормально смотрел? Тебя ничего не смутило?

@Serehajsss Месяц назад

@@WERWOLION все верно, header и footer могут быть внутри article, а заголовок в header и внутри article тем более быть может

@WERWOLION Месяц назад

@@Serehajsss чел Зачем стиль хедер h1 Если 1 h1 на странице. Включи мозг

@Serehajsss Месяц назад

@@WERWOLION ты сейчас серьезно задал этот вопрос? Думал на дворе 2024 год, а не 2010, где каждый считал что только один заголовок может быть на странице…

@user-xn3ox8hv9j Месяц назад

skopirovat simvoli kommentariya eto uje noviy uroven )))

@user-xn3ox8hv9j Месяц назад

mne 4 iy primer bolshe ponravilsa, no eto vse ravno ne sovsem poleznaya shtuka shtobi ispolzovat, eto pochti nichevo ne izmenyaet.

@vehiclesport662 Месяц назад

"FRONTENDBLOK" вы научитесь всему - перечислили все что должен знать верстальщик а не фронтер) крутой курс

@annblok_webdev Месяц назад

Курс так и называется "Продвинутый курс по вёрстке"

@WERWOLION Месяц назад

фронт это внешняя часть, если ты юзаешь фреймворк это не значит что ты вычеркиваешь всех остальных потому что фронт можно сделать на ванильном JS Это лично ты путаешь реакт разрабов который полные нули в верске с фронтендерами. Когда отрываешь сайт реакторов глаза кровью брызжут...