Тёмный

ГЛАВНЫЕ свойства в CSS Grid 

Просто: разработка
Подписаться 47 тыс.
Просмотров 5 тыс.
50% 1

В этом видео разбираемся со свойствами, которые отвечают за Шаблон, за то, как сетка должна выглядеть в Grid CSS: количество строк/колонок, ширина и высота ячеек. Познакомимся с укороченной записью, а так же, затронем свойство относящееся к грид элементу.

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

 

9 апр 2020

Поделиться:

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 22   
@prosto_razrabotka
@prosto_razrabotka 3 года назад
Не забудьте заглянуть сюда: ❓ Запись на консультацию - prosto-razrabotka.ru/ ✨ Telegram канал - t.me/prostorazrabotka/ 🔥 Telegram чат - t.me/prostorazrabotkachat/ Можете добавиться в друзья: 📷 Instagram - instagram.com/vitaliy.kirenkov/ 📘 ВКонтакте - vk.com/vitaliy.kirenkov/ 📗 Facebook - facebook.com/vitaliy.kirenkov/ 📙 LinkedIn - www.linkedin.com/in/kirenkov/ ✏️ Twitter - twitter.com/VitaliyKirenkov/ А так же, подписаться на страницы: 📘 ВКонтакте - vk.com/public195137161/ 📗 Facebook - facebook.com/prostorazrabotka/
@bohdanzghonnik6504
@bohdanzghonnik6504 3 года назад
Верстал все время на флексах, смотрю это и диву даюсь, как же все просто и изящно. Спасибо огромное за ролик, долго был консервативным и не хотел знакомится с гридами.
@AlexanderSoar
@AlexanderSoar 3 года назад
Если честно я не понимаю, почему так мало просмотров? Это же магия какая-то =) Посмотрю весь плейлист по гридам и буду на практике закреплять. Так вроде все понятно. Но когда представляешь как ты будешь верстать те или иные элементы, чет как-то плохо представляется =)
@saharaprotocol
@saharaprotocol Год назад
Спасибо. Отлично объясняете.
@prosto_razrabotka
@prosto_razrabotka 4 года назад
0:27 grid-template-columns 0:52 grid-template-rows 1:37 про fr 2:20 названия линий (grid line) 3:36 функция repeat() 4:02 grid-template-areas 4:49 grid-area 8:07 grid-template
@user-lc8vs4pb9z
@user-lc8vs4pb9z 4 года назад
Спасибо за обзор
@user-cd6vy3sk1v
@user-cd6vy3sk1v 4 года назад
Лайк без раздумий
@prosto_razrabotka
@prosto_razrabotka 4 года назад
Спасибо -)
@agilkerimov
@agilkerimov 4 года назад
Видео не хватает fadeIn & fadeOut
@kostiantynrudnyk9431
@kostiantynrudnyk9431 4 года назад
Спасибо за контент, про grid areas не знал, жду третью часть! P.S. Подскажите, как можно сделать границы со всех сторон у grid элемента так, чтобы эти бордеры не сумировались в толщине, а были одинаковыми?
@prosto_razrabotka
@prosto_razrabotka 4 года назад
Есть свойство grid-gap. О нем тоже будет видео ближе к концу серии.
@kostiantynrudnyk9431
@kostiantynrudnyk9431 4 года назад
@@prosto_razrabotka это свойство насколько я понял нельзя закрашивать, я хотел именно сделать чёрные границы
@prosto_razrabotka
@prosto_razrabotka 4 года назад
Тут уже нужно смотреть конкретно на задачу.
@agilkerimov
@agilkerimov 4 года назад
Stylelint ругается на grid-gap лучше использовать просто gap или column-gap & row-gap
@jebb3219
@jebb3219 4 года назад
Как я понимаю grid-template-columns: repeat(auto-fit, ...); позволяет отказаться от @media для адаптивной верстки и указывать контрольные точки в ширине grid-элементов. Стоит переходить на такой метод или @media предпочтительней?
@user-lb1nm6lo6f
@user-lb1nm6lo6f 3 года назад
Здравствуйте, подскажите пожалуйста, у мея в grid-template-areas в одной строке в кавычках может быть имя только одного типа, как только вписываешь туда хотя бы одно другое в окне браузера все пропадает, а при проверке пишет invalid property value, что может быть? Пишу в Sublime Text.
@prosto_razrabotka
@prosto_razrabotka 3 года назад
Пишите в чат. Я не телепат
@denpro9712
@denpro9712 4 года назад
Добавочку отгрузил :)
@prosto_razrabotka
@prosto_razrabotka 4 года назад
Оно стабильно сейчас будет догружаться)
@denpro9712
@denpro9712 4 года назад
@@prosto_razrabotka Мини сериал :)
@boldureans
@boldureans 4 года назад
ПЕРВЫЙ!
@prosto_razrabotka
@prosto_razrabotka 4 года назад
Ага!)
Далее
BABYMONSTER - ‘FOREVER’ M/V
03:54
Просмотров 3,7 млн
Ayollar orzusidagi er😂😂
01:01
Просмотров 781 тыс.
How To Make Toggle Button Using HTML & CSS
5:27
Просмотров 67 тыс.
CSS анимация / Основы CSS animation
27:20
CSS Grid - верстка будущего
27:54
Просмотров 39 тыс.
BABYMONSTER - ‘FOREVER’ M/V
03:54
Просмотров 3,7 млн