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

День тому

🔥 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

КОМЕНТАРІ: 55

@annblok_webdev 15 днів тому

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

@tetyana5295 14 днів тому

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

@yurok1991 15 днів тому

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

@olegivanov6231 15 днів тому

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

@user-ke3nn4fr4z 15 днів тому

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

@progerlife6690 15 днів тому

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

@user-FedorVorobyev 14 днів тому

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

@user-wy4zl9ue4u 14 днів тому

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

@JRs_Owners 14 днів тому

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

@user-wn9tk3uk5u 15 днів тому

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

@farmlingarchontas2216 14 днів тому

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

@marinagor 14 днів тому

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

@user-xg4ji5vd1r 14 днів тому

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

@user-hl3do4gt9x 14 днів тому

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

@user-ww7iq8eh2l 14 днів тому

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

@user-gq9bh3si4y 15 днів тому

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

@user-ek1sz6ie4k 15 днів тому

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

@user-hs7im8su7g 15 днів тому

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

@LostInspector 14 днів тому

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

@oxanaluzenko4709 15 днів тому

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

@Serehajsss 15 днів тому

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

@CityGorsk 15 днів тому

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

@user-oc9ho6kv1s 14 днів тому

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

@-minus140 14 днів тому

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

@user-mf9kn8wn4p 14 днів тому

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

@AniMag59 12 днів тому

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

@cooperanderson8651 14 днів тому

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

@Alex-mi2ij 14 днів тому

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

@Alexandr_Zavgorodniy 15 днів тому

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

@annblok_webdev 15 днів тому

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

@code-art-school 12 днів тому

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

@Agent-D 15 днів тому

Where are you from ? . . .

@Serehajsss 15 днів тому

Ukropia

@alexandergrigorenko4977 15 днів тому

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

@-minus140 14 днів тому

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

@vanzo16 9 днів тому

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

@kanz1t 14 днів тому

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

@annblok_webdev 13 днів тому

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

@WERWOLION 15 днів тому

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

@Serehajsss 15 днів тому

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

@WERWOLION 15 днів тому

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

@Serehajsss 15 днів тому

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

@WERWOLION 15 днів тому

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

@Serehajsss 15 днів тому

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