Где и как использовать имя линии/колонки в grid-template-columns?
Сейчас изучаю гриды и немного не понимаю такую вещь, я увидел на сайте что как один из параметров у grid-template-columns(или rows) это имя линии или строки типо:
grid-template-columns: [first] 40px [line2] 50px [line3] auto [col4-start];
вот, имена здесь указываются в [ ] и у меня такой вопрос, как потом обращаться к этим именам и зачем они нужны? можно ли обратиться к этому имени как к классу или id и изменить например задний фон?
Ответы (1 шт):
Например, вы можете блока, который содержит контент на странице сделать такой вариант
grid-template-columns: [full-start] minmax(15px,1fr) [main-start] minmax(0,930px) [main-end] minmax(15px,1fr) [full-end];
А затем добавлять в этот контейнер блоки и выбирать, как они будут отображаться: во всю ширину экрана или занимать максимум 930px. Для этого во внутренних блоках надо добавить параметр, который указывает именованную область, в которой разместить блок:
grid-column: full;
или
grid-column: main;