Тёмный

CSS text-wrap: balance 

Анна Блок
Подписаться 102 тыс.
Просмотров 20 тыс.
50% 1

✅ Invite you to participate in a free intensive: frontendblok.com/marathons/we...
*****
In this video I will talk about the new CSS properties: text-wrap: balance and max-inline-size
🔸 W3C - www.w3.org/TR/css-text-4/#tex...
🔸 Demo - codepen.io/anna_blok/pen/QWJwYay
🔵 Dzen - zen.yandex.ru/annblok
🔵 VK - tpverstak
🔵 Telegram - t.me/tpverstak
🔵 Telegram Chat - t.me/tpverstakchat
🔵 Instagram - / annblok
🔵 TikTok - / annblok_webdev
🔴 frontendblok.com/

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

 

8 июн 2023

Поделиться:

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 65   
@user-rk2tt8uc4j
@user-rk2tt8uc4j 11 месяцев назад
Я так рад, что есть такие люди ,как вы. Спасибо вам большое!
@user-bm5yk9gd3n
@user-bm5yk9gd3n 11 месяцев назад
Да, это прекрасно,спасибо за обзор!
@CityGorsk
@CityGorsk 11 месяцев назад
У вас простые и доходчивые уроки. Я только начинающий в этом деле, но с вашими уроками, обучение в радость.
@Youtuber__I
@Youtuber__I 11 месяцев назад
спасибо за наглядное и подробное объяснение, буду пробовать
@user-olena_shatun
@user-olena_shatun 11 месяцев назад
Спасибо большое за то что делитесь своим опытом и знаниями 😊
@vvelvest
@vvelvest 7 месяцев назад
интересная находка, спасибо
@miniyasya
@miniyasya 11 месяцев назад
Так работать реально быстрее выходит, буду учиться этому. Спасибо
@user-sq9mb8qo3e
@user-sq9mb8qo3e 11 месяцев назад
Хорошо, что есть такая возможность в работе с текстом, ведь это очень облегчит труд. Спасибо за видео, было приятно посмотреть и послушать!
@MorviCool
@MorviCool 11 месяцев назад
Топ. Люблю обзор новых фишек
@user-gq4lg1fq9u
@user-gq4lg1fq9u 11 месяцев назад
Хочу научиться кодить и хочу попробовать веб-разработку. Искал много видео и статьей по CSS, это одно из самых лучших ♥️
@tolasnisar2494
@tolasnisar2494 11 месяцев назад
Спасибо вам что все подробно расказал об этих обновления.
@gamestudio9722
@gamestudio9722 11 месяцев назад
Да, интересно получается, мне нравится такой подход.
@WERWOLION
@WERWOLION 11 месяцев назад
В ближайшее время. Я тут не могу gap использовать во flex, потому что кто-то решил проверить сайт на доисторическом айфоне. Это получается через 10 лет можно будет использовать? no wrap уже 100лет используется для троеточия
@user-hs7fi5se4f
@user-hs7fi5se4f 11 месяцев назад
Понятно и просто всё объяснили , видео получилось информативным и полезным.
@user-xj6ur2ei9k
@user-xj6ur2ei9k 11 месяцев назад
Хорошо, что есть такая возможность в работе с текстом, это очень облегчит труд!
@user-nh1zt7lj1t
@user-nh1zt7lj1t 11 месяцев назад
Так работать реально быстрее выходит, буду учиться этому
@user-no3dy3yv5t
@user-no3dy3yv5t 11 месяцев назад
Буду пробовать, выглядит это удобнее даже чем было
@viktordybach4108
@viktordybach4108 11 месяцев назад
Большое спасибо за полезную информацию.Очень качественный и подробный обзор.
@user-os2un8ij7z
@user-os2un8ij7z 11 месяцев назад
Благодарю за обзорчик и полезную информацию!!!!Желаю вам много подписчиков и процветания!!)))
@fcvaivai...............1268
@fcvaivai...............1268 11 месяцев назад
Люблю обзор новых фишек...😊😊😊
@fbdnfndbdbdb1523
@fbdnfndbdbdb1523 11 месяцев назад
О круто как раз начал этим заниматся вы мне очень помогли
@mybestislands8646
@mybestislands8646 11 месяцев назад
У меня вообще были проблемы с этим вопросом . Спасибо Вам за интересное новое качество , которое поможет мне . Лайк .
@alexschaus1909
@alexschaus1909 11 месяцев назад
Спасибо за хорошее видео просмотрел с большим интересом для меня это новое .
@rabirai8136
@rabirai8136 11 месяцев назад
Большое спасибо разработчикам теперь намного удобнее станет работать с текстом.
@tetyana5295
@tetyana5295 11 месяцев назад
хорошо, что работа с текстом теперь стала удобней, эта функция понадобится многим в своей работе и сделает их труд легче и проще
@user-dv9fk1hd3s
@user-dv9fk1hd3s 11 месяцев назад
Не буду использовать на проектах, потому что малый процент поддержки. Ждем от 90% и вот только тогда...
@user-wy4zl9ue4u
@user-wy4zl9ue4u 11 месяцев назад
Наверное, долго ждать придётся. Пока не разберутся с переносом по слогам, на это рассчитывать не приходится.
@user-dq3fv2mk8e
@user-dq3fv2mk8e 11 месяцев назад
Неплохо, мне кажется так теперь реально удобнее стало
@HelloHovo
@HelloHovo 11 месяцев назад
Спасибо большое Анна . Хоть я на W3 подписан но эти свойства там пропустил .
@annblok_webdev
@annblok_webdev 11 месяцев назад
В соцсети следите или по email подписались?
@HelloHovo
@HelloHovo 11 месяцев назад
@@annblok_webdev Простая закладка на раздел новости
@elizavetashatskikh
@elizavetashatskikh 9 месяцев назад
Интересное свойство, поддержка уже ~58%
@baileysli6235
@baileysli6235 11 месяцев назад
`max-inline-size` это то же самое, что `max-width`, только как логическое свойство. То есть для иероглифической письменности, где текст сверху внизу это будет высота, не ширина.
@arsa946
@arsa946 11 месяцев назад
Спасибо. Хорошее новшество. Но вот если добавили переносы по слогам, вообще были бы красавчиками. Чтобы не ставить JS.
@annblok_webdev
@annblok_webdev 11 месяцев назад
Ещё слог можно соединить через неразрывный пробел в разметке, но согласна, что этого не хватает.
@user-ti4jh3qx9w
@user-ti4jh3qx9w 11 месяцев назад
В html добавь атрибут lang с кодом языка, и тогда css hyphens: auto добавит мягкие переносы
@arsa946
@arsa946 11 месяцев назад
@@user-ti4jh3qx9w спасибо. Интересно, попробую.
@fkfaiaj
@fkfaiaj 11 месяцев назад
Nice and amazing video I love this video ❤❤
@user-gg1jn8ul3i
@user-gg1jn8ul3i 11 месяцев назад
Обновление это всегда хорошо. Теперь работать стало намного проще.
@nemo417
@nemo417 11 месяцев назад
Очень удобное свойство! Надеюсь, поддержка его вскоре расширится
@alinaevhenivn6
@alinaevhenivn6 11 месяцев назад
Де соглашусь с вами, надеюсь тоже что вскоре все станет лучше и расширяется
@sergeymickolaenko1161
@sergeymickolaenko1161 11 месяцев назад
Уверен такая поддержка будет востребована многими💯
@PearlDpUa
@PearlDpUa 11 месяцев назад
Наконец-то программисты сделали нашу жизнь еще проще)
@user-lc8eg7jy3i
@user-lc8eg7jy3i 11 месяцев назад
Такой метод работы с текстами сильно облегчит мне работу
@senya959
@senya959 11 месяцев назад
Да сейчас главное знать где найти и ты будешь все уметь .
@spirit1292
@spirit1292 11 месяцев назад
Ситуативное свойство. max-width все равно будет использоваться на постоянку.
@user-rc5jz2rs1o
@user-rc5jz2rs1o 11 месяцев назад
здравствуйте , хотел узнать где можно найти макеты для тренировок ?
@annblok_webdev
@annblok_webdev 10 месяцев назад
boosty.to/annblok
@dembelsky
@dembelsky 11 месяцев назад
Прикольная новая фишка! Правда пока не понимаю зачем она мне, но хотя бы фактор интереса появился!
@alaga3195
@alaga3195 11 месяцев назад
За text-wrap: balance; лайк
@user-dh1gs5lj8w
@user-dh1gs5lj8w 11 месяцев назад
Полезные свойства- теперь текст будет выглядеть лучше.
@vadimanishchenko3976
@vadimanishchenko3976 11 месяцев назад
Форма регистрации на интесив не работает. Валится на этапе заполенения личнх данных. Пишет 'Введите ссылку с ' при уже введенной валидной ссылке на профиль. Возможно сказывается тот факт, что я зарегался 12... на момент формального старта курса
@annblok_webdev
@annblok_webdev 11 месяцев назад
Проверьте, нет ли в домене лишних символов. Бывает, что вставляют ссылку мобильной версии VK с буквой m в домене
@vadimanishchenko3976
@vadimanishchenko3976 11 месяцев назад
@@annblok_webdev Так и было. Спасибо.
@jmol1003
@jmol1003 11 месяцев назад
Всегда думал что работать с текстом в CSS всегда по одному алгоритму, но я ошибался
@Atractiondj
@Atractiondj 10 месяцев назад
Да это свойство до сих пор не работает в хроме, хотя сам гугл заявил и продвигает это свойство... открываешь браузер и там тебе желтая плашка пишет, неизвестное имя свойства! И ничего не работает!
@kopchik1000
@kopchik1000 11 месяцев назад
Ну мне это совсем не пригодится но за советы и труд - заслуженный лайк.))
@sergejchap62
@sergejchap62 11 месяцев назад
был очень удивлен, FF =< 99, Opera 69 не поддерживают height:100svh;. Приходится задавать жестко height: 900рх; если на весь экран. Про адаптацию в 99-69 можно забыть. Меж прочим не такие старые версии. 111-113 хром, 114 ФФ уже поддерживают svh К теме, почему б блок или див не задать weight: 100svh; height: 100svh; Разумеется, если есть поддержка браузера. или в height:100%; Тогда любое содержимое будет в адаптации. Наверное. Наверное это про любое.
@neins
@neins 10 месяцев назад
caniuse на свойство text-wrap в целом показывает что-то около 37% по всему миру...
@TheMonsterLPchanel
@TheMonsterLPchanel 11 месяцев назад
какой смысл от text-wrap свойства с поддержкой в 30% если есть white-space у которого поддержка 95%
@kseniiaazovtseva6139
@kseniiaazovtseva6139 10 месяцев назад
Неплохо, но бесполезно пока поддержка 37%
@ipmen891
@ipmen891 11 месяцев назад
Чотка
@user-me8cn1hk6j
@user-me8cn1hk6j 11 месяцев назад
Полезная, как на меня, передача. Много для ебя почерпнул. Спасибо!
@user-ys4ug1hc8d
@user-ys4ug1hc8d 11 месяцев назад
Видимо, полезная вещь. Но явно не для меня.
@TheKelikat
@TheKelikat 11 месяцев назад
типографская хрень
Далее
How to use BEM naming CSS in practice?
33:12
Просмотров 110 тыс.