Сетка Bootstrap. Что это такое и как этим пользоваться. Оооочень подробненько!
Вставка
- Опубліковано 2 лип 2017
- Всем привет, добравшись до канала глубокой ночью я наконец-то записал видео про сетку Bootstrap. Как всегда занудненько, но все разжевал для самых маленьких веб-дизайнеров! Прекрасная музыка на фоне - группа "Сплин", за что им спасибо!))
Ссылка на файл с сеткой Bootstrap
drive.google.com/open?id=1B_7...
Реклама на канале: sp44sp44sp44@gmail.com
Мой курс по веб-дизайну (500 руб) можно купить здесь:
spoonpay.com/goods/2517_dizay...
Большой курс по веб-дизайну (2000 руб) можно купить здесь:
spoonpay.com/goods/5071
Мое дистанционное обучение по веб-дизайну (10 000 руб) .
Записаться тут sp44sp44sp44@gmail.com
Я предлагаю:
Разработка сайтов "под ключ"
Создание фирменного стиля
Создание логотипов
Дизайн сайтов
Почта для обращений: sp44sp44sp44@gmail.com
Мой телеграм-канал
t.me/webdivan
Мой онлайн-сервис для дизайнеров:
mocover.net/
Мой инстаграм
stanislavka...
Мой фейсбук
profile.php?...
Мой Behance
www.behance.net/Sp44
Архитекторы, которые делают крутые рендеры для нас:
meta-a.com.ua/
Большое спасибо за видео - очень информативное , без воды и "на пальцах" - то что нужно начинающим!
Спасибо, очень рад, что было полезно!
Огромное Спасибо!!! Меня всегда мучала эта неопределённость с сеткой... Вы помогли мне расставить у себя в голове эти точки над ё..))
Огромное спасибо! Еле нашла то что нужно, кругом одни видео для верстальщиков по бутстрапу, а для дизайнеров действительно ничего нет.
Спасибо большое за такое подробное разъяснение! Очень доступное и понятное видео для новичков! Вы здорово мне помогли :)
Очень здорово, что помогло, это самое главное, спасибо, что смотрите)
Большое спасибо за информацию,очень полезная, музыка конечно оставляет желать лучшего, но объяснение и примеры просто шикарные
Продолжай в том же духе!
Нето смотрят всяких там веб девелоперблогеров
Спасибо вам большое за уроки! И контент у вас очень качественный -- все что нужно, и сам человек приятный, голос очень мягкий, приятно слушать и учиться. Успехов вам!)))
спасибо! успехов и вам тоже
Очень полезное обучающее видео. Ваши видео очень легко и приятно смотреть. Большое спасибо за Ваш труд :)
Большое спасибо, Вадим, очень приятно)
Видео классное. Логичное и понятное.👍
круто,все доступно і зрозуміло, дивився на одному подиху навіть ніякої музики на фоні не чув)
автору респект.
Дякую)))
Вооот... :D
Благодарю за урок.)
эта музыка сведет меня с ума
а контент годный, но у меня большое сомнение, что верстальщику удобно, если внутри контейнеров сделано абы как, не ровняясь на сетку и без особой логики в случае единичных элементов.
Огромное человеческое СПАСИБО!
Не за что!
Спасибо. Наконец разобрался.))
Пожалуйста, круто)
За Сплин отдельный лайк)))
Большое спасибо за видео, все информативно и понятно, Вас интересно слушать) Единственное пожелание, можно делать чуть тише музыку на фоне, особенно для случаев если кто-то смотрит на скорости х1.5 или х2, при таком громком фоне обычно все это превращается в адовую какафонию :D Спасибо!
спасибо за видео )))
Ты крут, мужик. Пожалуй подпишусь.
Спасибо, мужик!! Рад, рад))
Большое спасибо!
спасибо за видео, помогли разобраться, только музыка эта отвлекает на фоне, имхо она вам не нужна совсем
Яна, спасибо, учту, просто классная музыка) но, наверное, для длинного видео она вышла слишком монотонной
Спасибо большое!!
фух!.. уже приходилось рисовать по сетке, не зная, насколько она строгая)
а на одной "крутой" лекции задала вопрос про текст недавно, так с меня все тупо поржали. очень мило...
теперь благодаря вам поняла, что я не один такой лох ) и заодно, как сеткой правильно пользоваться )
спасибо
о! еще. а есть урок, как перекладывать на другие устройства? собственно, делать адаптив?
Прикольно) спасибо и вам!!
Спасибо. Рекомендую всем почитать про позиционирование при верстки. Там 4 типа. Нужная инфа.
спасибо, Дима, гляну то же по свободе!
супер, спасибо
Пожалуйста)
Как я понял - это контейнер, который указывается размером колонок. А внутри контейнера уже можно давать волю, флекс-бокс сам сделает свое дело при адаптивности, главное разместить контейнер по блокам для верстки
Спасибо!
Спасибо большое, очень полезное видео, разжевали и в рот положили) Жаль только не затронули вопрос по поводу кнопок. Очень хотелось бы узнать от вас))
спасибо большое) кнопки так же само как и текст и как все остальное, если имеете ввиду бутстрап
Кто смотрит из октября 2019?
из 2020 уже смотрю
При размещении текста по сетке не забывайте про понятие знакоместа. Неоднократно видел, как дизайнер умещал, например, текст заголовка пиксель в пиксель, а на верстке все уезжало, так как технически символ обычно немного шире, чем нам видится, и надпись уезжала.
Спасибо за полезное видео! Лайк и подписка)) Скажи пожалуйста, а какие сетки использовать для Планшета и Мобилки? Может есть ссылки или хотя бы размеры колонок и гаттеров для них? И ничего ли,что в этой декстопной сетке некоторые колонки 67, некоторые 68px?
Спасибо, что смотрите)напишите мне на почту и я скину вам шаблоны сетки, ширина колонок будет отличаться. То, что где-то 67 и 68 ничего страшного, пара пикселей не беда. Просто не делится по одинаковым ширинам - парадокс. Моя почта sp44sp44sp44@gmail.com
Спасибо
хороший канал подписался) нравится ваша подача информации!!) посмотрел внимательно ваше видео все супер, но вот меня интересовало именно информация про адаптивный дизайн, расширениях сеток, пространство для прокруток в макетах, фиксированные размеры макетов, актуальность расширений при создании макетов.. вы можете дать наводку именно на данною информацию?
Спасибо за отличный урок! Как раз то, что надо для новичков. Голос очень спокойный, микрофон супер. Музыку даже не заметила, потому что все внимание было на голос и информацию У меня вопрос назрел по видео. Как появляются эти розовые разметки, где указана информация по отступам в разные стороны? Это происходит автоматически по сетке или это какие-то горячие клавиши?
Огромное спасибо, Юлия! Эти розовые разметки появляются в версии Photoshop CC, нажимаешь Ctrl, наводишь на объект и видишь сколько пикселей до него от выделенного объекта
А может правильнее будет контейнер на 1170px, с колонками по 70px, пробелами по 30px и по 15px по краям, как раз задавая общую ширину сетки в 1200px?. А то, по вашей сетке, выходит погрешность в 6 пикселей..Непонятно почему bootstrap выкладывает такие неточные сетки...Но видос классный и полезный!
Дбрый день. Данные рекомендации касаются только сетки под бутстрап 68-30 или любых других сеток? (Я пользуюсь сеткой на 12 колонок 60 -20 )
Добрый день, касается всех размеров сеток
Интересно - познавательно. Еще бы понять каким образом это видео имеет отношение к теме Bootstrap (кроме размера сетки) и то в Photoshope. Так все таки для чего нужен Bootstrap и в чем его суть?
Здравствуйте Стас, спасибо за видео! Скажите, обязательно для Бутстрап ширина колонки 68, гаттер 15?
Здравствуйте, Юрий, вот вам ссылочка habrahabr.ru/company/rambler-co/blog/261679/ можете почитать, сразу скажу, что сетку вы можете выставлять по-своему размеру, но это уже будет не бутстрап, но нам важно чтобы дизайн был сделан по сетке в принципе, необязательно это должна быть бутстрап
Спасибо.
Постоянно вижу что рабочую область делают не 1170 px, а больше - 1200, 1300 и т.д. Это законно? В чём разница?
Благодарю за классное видео. Все по делу, с примерами, без воды, мне стало легче и понятнее, очень уж переживала за недопонимание как правильно работать с этими сетками. Желаю вам успехов в развитии канала, посмотрела ваш урок на одном дыхании.
Скажите, пожалуйста, а насколько принципиален размер колонки в 68 px, отступов в 15, межколонника в 30 px? Если можно делать сетку самостоятельно, то я могу подобрать и свои величины или лучше придерживаться данных размеров?
Спасибо, Валерия. Можете играть этими расстояниями, конечно. Тут важен сам алгоритм, а сами расстояния и размеры можно делать такие, которые подходят именно вашему макету. Но, опять же, если вы делаете реальный проект и знаете, кто будет верстать, лучше спросить у него, можно ли делать свои размеры. Например, вчера ко мне обратился клиент и он хочет, чтобы расстояние между колонками было 16 пикселей, то есть отступы по 8, если бы он не сказал я бы делал по стандарту по 15 пикс, получилось бы 30 и было бы совсем не то
@@WebDesignlessons понятно, спасибо)
Thanks ;)
здравствуйте! спасибо за видео! есть вопрос...так какую ширину холста делать..Почему одни делают 1920, а другие 1720 или вообще 1170??
Здравствуйте, на этот вопрос в комментарии не ответить, так как сильно много писать. Вкратце скажу, чтобы макет сайта на всех устройствах выглядел красиво нужно делать разную ширину холста.
Добрый день , в начале своего урока вы показываете ширину колонки 68 px и отступ 15 px если перемножить получается 1176. Я скачал ваш бутстрап там половина 68 и половина 76 + отступы получается 1170 . Первый раз буду делать дизайн зайта по знакомству , хочется перед верстальщиком не упасть в грязь лицом . По вашим сеткам я спокойно могу делать адаптивный сайт ?
Здравствуйте, я перепроверил, там 68 и 67, двойные отступы по 30 пикс. по краям по 15. Можно делать по этой сетке, да. Просто 1170 не делится четко на 68 пикс и отступы по 15, чтобы было 12 колонок
У меня при открытии сей сетки, она узкая. Как сделать так, чтобы она была более расширенной, как у вас на видео?
это такая же сетка как и у меня на 1170 пикс по ширине. Она не может быть уже чем у меня. Просто я показывал это видео на мониторе, видимо, меньше чем у вас. У вас по бокам появляются свободные пространства без сетки и так должно быть. В этих пространствах без сетки мы ничего не дизайним, ну, кроме залить фоном или сделать фото на всю ширину страницы - это нормально, но вот размещать туда контент не стоит
Привет! Спасибо за канал! Очень интересный! У меня возникло 2 вопроса: 1) я не поняла, зачем нужны 15 писк. отступы в столбцах (каково их техническое предназначение), если мы по ним все равно не ориентируемся и ничего к ним не привязываем. Просто чтобы отделять эти столбцы? 2) почему все-таки следует сохранять это расстояние между вертикальным меню и баннером по всей длине страницы? Чем это чревато?)) Спасибо!
Здравствуйте, подскажите пожалуйста, что то я не догоняю))) делаю по сетке 4 карточки, в 3 колонки соответственно, первая 263 пкс, но вторая уже 262 пкс.... как быть?
Привет! Ничего страшного, по-другому никак, это абсолютно нормально. Иногда даже сетка бутстрап гуляет на 1 или 2 пикселя, тут ничего не поделаешь
Здравствуйте Стас, я ваш подписчик и мне ни как не понять, какой принцип адаптивной вёрстки. В интернете я скачал 3 сетки: 1920 пик. в ширину сам холст, а сетка 1230 пик. - это, как бы, разрешение монитора, 764 пик. сама сетка и холст - это планшет, 480 пик. холст и сетка - это телефон. Я боюсь, что когда сделаю макет сайта с помощью первой сетки у меня появится горизонтальный скрол (как вы называете бочина). Как мне этого избежать? Или не парится, так как сетки правильные?
Здравствуйте, на 1920 пикс стандартная бутсраповская сетка будет на 1170 пикселей. А вообще пропишите в инете типа шаблон бутстрап и можно найти сетки для всех размеров.
Здравствуйте. Пробовал построить эту сетку в Figma, но выходит так 12колонок по 68 это 816 и 11 отступов по 30 и 2 по 15 это 360. Итого 816 + 360 = 1176, а не 1170. Что делать с лишними 6 пикселей ?:)
*Обязательно использовать сетку 1170?* есть же есть меньше которые. просто я обычно делаю сайт 980 по ширине, поскольку не всегда уверен, что верстальщик будет делать адаптивным его
конечно, необязательно делать 1170, делаете так как вам нужно. ну по стандартным размерам сетки
пару слов бы еще добавить о адаптивном сайте который на всю ширину экрана или на 1580 например. а так же про ретину. за урок большое спасибо
ну эт в следующий раз может уже, сюда не добавлю никак )
можно вопрос,когда мы делаем дизайн сайта (веб дизайнеры) нам надо тоже делать планшетную и телефоную версию?когда я ходил на курсы мы брали размер сайта 1680пикс а сетка 1140,у вас же 1920 пикс и сетка 1170 пикс,как правильно?и еще один вопрос когда мы делаем баннеры какой брать размер и когда для приложений?заранее Спасибо,надеюсь получить ответы)))
Правильно и 1140 и 1170, смотря в каком случае, лично я всегда пользуюсь шириной 1920 и сеткой на 1170, в идеале нужно делать несколько версий сайта и под мобилку и под планшеты, при этом делать под вертикальное положение устройств и горизонтальное. Но можно сделать всего один макет под мобильное устройство и все. Там дальше разраюотчики сами будут крутить и вертеть как нужно. Так как если маленькая оплата, то не очень охота делать 6 или 8 размеров сайта, нафик оно нужно, только время свое тратить
Баннеры можно делать абсолютно любые
в документации к bootstrap 3 - 1170, bootstrap 4 - уже 1140
Спасибо за видос. Как обычно несколько вопросов:
1. Почему у текста стоят пиксели а не пункты? ))
2. Про правило скругленных углов. Если у меня основные плашки с контентом идут с небольшим скруглением, я же могу помещать в них обычные фото без шаманств с углами? А так же вообще это не слишком старомодно(скругленные углы именно не в кнопках а у больших плашек-фонов)?
3. Про выравнивание футера тоже конечно хотелось бы посмотреть, например я постоянно в нём вязну и путаюсь, как там группировать информацию и как её выравнивать.
Привет,
1. Ну, вообще, по правилам там должны стоять пиксели, но раньше я ставил пункты и не заморачивался, потом меня одернули и сказали обратить а это внимание, так как пункты это про полиграфию. Пикселы используются в веб-дизайне
2. Можно, конечно, помещать в скругленные плашки фото с углами, главное чтобы красивенько было. Ну и если красиво сделано, то старомодно казаться не будет, если делать скругленные плашки. Вон, самсунг с8 со скругленным экраном вышел и круто же)
3. Про футер запишу видос по свободке
Спасибо за информацию!
Посмотрел внимательно видео и переписал размеры. Однако в итоге всё подсчитав, считаю, что макет должен быть в точности 1176px, так как число должно быть кратным 12ти (то есть делиться на 12 колонок). Иначе 6 пикселей куда-то выпадут и превратятся в погрешность.
Эти расчёты можно проверить на gridcalculator.dk и обратить внимание на строку "Page width". Если она зелёная значит размер точный, если красная, значит пиксели будут выпадать.
Это для тех кому интересны самые точные размеры. =)
спасибо за такую точность)) На самом деле именно этой погрешностью сетки пренебрегают, но некоторым важна точность и это тоже круто)
За Сплин фоном + )
спасибо) они прекрасны)
уважаемый автор а, что у вас за микрофон, какая модель,возможно ли использования таких микрофонов для проведения митингов и общения онлайн?
врядли для митингов подойдет. Для онлайн общения возможно. Это конденсаторный микрофон MXL V67. Для конденсаторного микрофона нужно фантомное питание, которое есть во внешних звуковых картах. Поэтому на улицу его брать вообще не то. Для митингов подойдут динамические микрофоны, которые не требуют звуковую карту с фантомным питанием. Так же есть конденсаторные микрофоны, которые не требуют фантомное питание и крепления у них другие (для стойки самое оно) На митинге подключить проще. Но лучше всего вам подойдет динамический микрофон
спс
Здравствуйте! било бы здорово узнать подробно как работать с инструментом перо. запишите пожалуйста видео. Спасибо!
Здравствуйте Стас,скажите пожалуйста какие шрифты вы наиболее часто используете,если не трудно ваш топ-5
Есть на канале уже
здравствуйте, Макс, на канале действительно есть видео про шрифты, посмотрите. топ 5 отобрать сложно, так как много разных шрифтов для разный идей, но топ 30 там есть))
Здравствуйте, Макс, ну честно топ 5 у меня нет шрифтов, но часто пользуюсь такими: fira sans, helvetica, lato, roboto, museo, georgia, intro
Спасибо вас Станислав большое,просто я только учусь Web Designу, курсы не заканчивал,черпаю все от вас и с инета ( заказов больших толком и не было,в основном делаю все для портфолио )
и недавно выложили мою работу в группу "behance"в вк,и многие раскритиковали мой шрифт,сказали что "Myriad Pro" не читабельный,хотя как по мне он там смотрится хорошо,вот решил спросить у вас.
P.S а можно я вам скину свой профиль в лс? скажите своим проф взглядом стоит продолжать,что не допустим хромает и смогут меня с таким багажом взять на работу
ну вообще-то myriad pro например использует компания apple, и он достаточно неплох собой. может его стоит использовать только для заголовоков, а строчный текст им не набирать. можете мне выслать свои работы на sp44sp44sp44@gmail.com и я гляну, по свободе отпишусь!!
Очень хорошо музыка фоном идёт, впервые не хочется ругаться за фон музыки в учебных роликах. А как называется композиция?)
спасибо) на фоне музыка из песни "Увертюра" группа Сплин
Можно ли сделть после 4х колоночной карусели товаров трехколоночную карусель контактов, например, даже не карусель, а их всего три контакта.
Можно. Вообще можно делать все, что угодно. Просто верстальщику будет либо проще это воплощать, либо сложнее
просто я сам верстал раньше, но о фреймворках не знал, так как верстал на чистых html, css очень давно, а щас решил вернуться, вспомнить весртку и подкачать wd.
Я понял. Вам лучше посмотреть канал webdesign master там чувак рассказывает и о дизайне и о верстке и о программировании, а то у меня тут только дизайн
Вы тоже клево рассказываете. Спасибо большое за уроки.
О том канале я тоже слышал, тоже клевый.
Меня больше интересует сам процесс работы на fl.ru или подобных, потому что, как я понял, не умея верстать, "натягивать", прикреплять, а умея делать только макеты много не заработаешь?
Нет. Поля не для того, что "так удобнее" и "потому что". К столбцам применяются левое и правое поля в 15 пикселей, которые обеспечивают, чтобы контент отступал от края столбца на те же 15 пикселей. Поэтому у нас между столбцами 30 пикселей без контента, а по краям страницы - 15. В которые по бутстрапу нельзя заверстывать начало и конец контента. Можно, конечно. Если ваш дизайн СПЕЦИАЛЬНО предполагает такой прием. Для любого дизайнера полезно немного разобраться в верстке. Сильно облегчит жизнь. Вот документация по сетке от бутстрапа getbootstrap.com/docs/4.1/layout/grid/. Поищите, есть на русском перевод.
Ребята и девчата-дизайнеры!!!! Если вы верстаете по сетке бутстрапа, то именно ее и придерживайтесь. Дело в том, что полет вашей дизайнерской мысли ничто остановить не в силах))), а технически бутстрап это четкий набор правил и размерностей. И зачастую верстка ваших творений превращается в АД. Это я вам как верстальщик говорю)))
Но ведь это ваша работа
Вам удобно рисовать детальный портрет куском угля размером с яйцо вместо карандаша? ))) Вот и мне неудобно верстать то, что не соответствует техническим средствам бутстрапа. Такая верстка зачастую требует размещать картинки из макета там, где можно было бы использовать кусочек кода css, потому, что техническими средствами бутсрапа этого сделать с применением css кода просто нельзя, или придумывать скрипты, которые могут не работать в разных браузерах. И чем больше таких картинок и скриптов, тем дольше грузится сайт. Я не говорю, что не надо делать оригинальные макеты))), просто если вы верстаете именно под бутстрап, то желательно придерживаться его технических требований.
Солидарен. Тяжело найти середину, которую полюбит и верстальщик и оформитель дизайнер. Тут всегда проблемы
Здравствуйте!
Немного не в тему, но можете скинуть, пожалуйста, сетку на для телефонов и планшетов. У меня есть какие-то, но не знаю правильные они или нет.
Привет, вот по ссылке загрузил сетки, все, которые у меня есть drive.google.com/open?id=1EvvrPfvfemv5IDXX0S0jmqiHsSO6TYlb
спасибо большое!
Спасибо за видео! Не пойму только 2 вещи: 1. Зачем скачивать сетку, если её можно настроить в фотошопе? 2. Почему межколоночный интервал разбит на две части(15+15 пикселей)? Для чего?
Пожалуйста! Кому-то проще скачать, чем сделать самому, а те 30 пикс деленные на 2 просто для удобства
Добрый день. А 5 колонок можно добавить? Если 4 колонки мы записываем как - 4 раза по .col-md-4 то как быть если человеку просто захочется чтоб там было 5 блоков?
5:40
Можно сделать 5 колонок. Но нужно заранее это продумать так, чтобы все было четко. Необязательно делать все блоеи прям по бутстрапу, можно некоторые блоки делать и на глазок, но чтобы это было красиво и практично. То есть бутстрап не должна останавливать вас в воплощении своей идеи. Бутстрап можно сделать как 12 колонок. Так и больше и меньше. Посмотрите в инете готовые псд файлы с бутстраром и скачайте
WebDesign lessons большое спасибо)
в бутстрапе по умолчанию 12 колонок. col-md-4 означает что ваш блок состоит из 4х колонок. т.е. всего на странице будет 4 блока по 4 колонки. Если вы хотите сделать 5 колонок то нужно кастомизировать бутстрап и сделать в нем поумолчанию не 12 колонок, а 15. Тогда можно будет сделать col-md-3 колонок 5 штук. но тогда и сетку нужно менять.
править бутстрап это в файле bootstrap.min.css?
Можно там, но это довольно сложно. Можно зайти на сaйт бутстрапа и там настроить а потом скачать. www.bootstrap-3.ru/customize.php тут 3ю версию можно настроить
Стас, спасибо большое. А если стоит задача сделать сетку для другого формата, например 1000 на 1000 пикс. Как тогда строить её, скачивать и пользоваться?
Антон, все просто, короче самое главное у тебя есть, например 12 колонок. Отступы от краев макета делаешь такими какие тебе удобны, ширину самих колонок тоже, расстояния между колонками делаешь тоже такими как тебе удобно и в таком ключе рисуешь 12 колонок и вперед. Можно рисовать не 12 колонок, но смотри чтобы потом было удобно делить, можно кратно 12
@@WebDesignlessons спасибо что отвечаешь. потом поелюсь результатом как разберусь. решил профессию сменить ))
@@anton_youtube_1 ))) круто, пробуй, много практикуйся, это самое главное
А как ты смотел пиксели на 6:18?
При зажатой клавише Ctrl. Но эти направляющие присутствуют начиная с версии фотошопа CC
Добрый день, спасибо за содержательное видео.
У меня возник вопрос. Судя по вашему и многим другим видео, в сетке под Bootstrap используются отступы между колонками в 30px (2 раза по 15), А как быть в случае, в котором настолько огромные отступы просто не нужны? а например нудны отступы в 5, 10, 15px между колонками? Как это отразится на верстке в Bootstrap?
Добрый день! Помним, что если сетка каким-то образом не вписывается в идею дизайна, то мы ей пренебрегаем, сделайте сетку которая удобна вам в конкретном дизайне, сделайте ее подсебя , ничего страшного, главное, что сетка будет, необязательно делать ее стандартной
Да, но ведь ваша сетка универсальна под bootstrap. Тоесть если взять полотно шириной в 750px (Small devices) и подставить вашу сетку 1170px (Large devices), то она подойдет. Если же я изменю ширину отступов, то потеряется универсальность. Тоесть сетка под разрешение 1170px не подойдет под остальные, указанные в документации к bootstrap.
Либо я неправильно все понял (
Если вы меняете размеры сетки и отступов, например, в десктопе, то и на всех остальных размерах вы придерживаетесь своей сетки, бутстрап это не эталон, необязательно ориентиповаться именно на нее, тут уже будет важно, что, впринципе, присутствует логика сетки, любой
Тоесть правильно ли я понимаю. Если стоит задача сделать адаптивный дизайн под iphone, ipad и десктоп но начиная с разрешения 1024x1080. То необходимо начать просчитывать сетку сначала под самое маленькое разрешение и уже затем ее же, но большей по ширине использовать в макетах большого разрешения? Что бы все блоки помещались как на маленьких разрешениях, так и на больших? Или это не выход и все равно необходимо делать макеты и блоки индивидуально под каждое отдельное разрешение (извиняюсь если не очень четко выразил мысль).
Как сделать чтобы единицы измерения вспомогательных элементов были в ПИКСЕЛЯХ? у меня в дюймах(
а всё, разобрался, надо на самой линейке, слева которая, нажать правой кнопкой мыши и выбрать единицы измерения
Какой у тебя микрофон скажи пожалуйста
По-моему маршал mxl какой-то там.. Не могу сейчас посмотреть
А подскажите ещё один момент пожалуйста, а почему обязательно, как бы делить на два поля?
Совсем не обязательно, просто был показан вариант когда имеется вертикальное меню слева
WebDesign lessons ааа, спасибо ;) я теперь фанатка вашего канала))
Здравствуйте, Стас!
Хочется поблагодарить вас за старания и за, в большинстве своем, отличные ролики! но, боюсь, что с такими объяснениями новички запутаются еще больше :(
Очень много воды, очень размазано, непонятен общий принцип и логика сетки, то нельзя залезать за колонки, через пять минут уже можно, если очень хочется))) получается каша(
Почему нельзя залезать в одном месте, почему можно - в другом? сказали бы просто, что внутри материнского блока можно не соблюдать правила сетки и ставить элементы по своему усмотрению, главное, чтобы сам материнский блок был по сетке. Мне нравится ваш канал, но иногда подача информации очень хаотична и в итоге пользы от нее - минимум.
Не обижайтесь, пожалуйста, просто хочу, чтобы вы развивались дальше! Удачи!
здравствуйе, Саша! спасибо большое за критичный отзыв, я ни в коем случае не обижусь, более того приму во внимание, я с вами согласен полностью, вы хорошо это подметили, что подразмазанно, хотел как всегда разжевать, но перестарался, наверное)) еще раз спасибо, будем исправляться!!
не пойму почему 1170 ширина, если 1140 написана ширина уже с отступами?
Ссылка на файл с сеткой Bootstrap НЕ работает! Not Found
Error 404
ага, поправил. качайте
Ok. Дякую!
иии... огромное спасибо тебе за труды! Многим недостает развернутых, детальных и всесторонних ответов и советов))) прям почти стихи.
хороший белый стих)) Спасибо, что смотрите
Как наложить бутстрап сетку на готовый макет psd, который был создан без сетки в Фотошопе ?
Даже не знаю. можно просто сделать сетку (направляющие) а потом подровнять по ним весь макет, но лучше бутстрап делать сразу
@@WebDesignlessons ОК с этим. Слышал Grid CSS появился. Надо ли учить Bootstrap?
Evan D. Как показывает практика бутстрап знать точно нужно, спрашивают постоянно о нем. С grid css не сталкивайся еще
@@WebDesignlessons Кто спрашивает о Бутстрапе?
Evan D. Разработчики
Добрый день, а подскажи пожалуйста, вот сейчас наблюдаю тенденцию делать сайт карточками без отступов между ними (их заливают цветом, градиентом, фото и т.д.), т.е. карточки плотно прилегают друг к другу. Бывает в одном месте встречается и две, и три, и четыре карточки. Как действовать в таком случае? Делать так, чтобы они встречались ровно по центру сердечника или как? Спасибо!
добрый день, можно чтобы по середине сердечника встречались, ничего страшного что карточка прилегает к другой, то есть главное придерживаться логических отступов. если наметил что расстояния между ними не будет вот так и делай весь сайт
Очень всё хорошо объяснил, но надо поработать с речью) слово -- ВОТ --- услышал 1024 раза и отсюдова слова нет
Да, сложно избавиться от такого, не так легко и не с 10 раза даже)
Сына не могу отучить от этого)
))) слова-паразиты, да, глубоко в мозгах заседают, я только недавно стал более-менее следить за этим и последние видео менее насыщены этим "вот"
Извините, а как скрыть сетку?
Ctrl + H
СТАНИСЛАВ, БУДЬТЕ ДОБРЫЙ, ДАЙТЕ КАКИЕ НИБУДЬ СВОИ КОНТАКТЫ! ОЧЕНЬ МНОГО ВОПРОСОВ, ПОМОГИТЕ ОТВЕТИТЬ ПОЖАЛУЙСТА (НАДО ИМЕННО ПОКАЗАТЬ)
sp44sp44sp44@gmail.com
а как это дело внедрять в сайт
а это уже вопрос к верстальщику
Скорость 1,5 Good
Спасибо ,за такой подробный урок .У вас на сайте spoonpay есть курс по созданию интернет магазина ,нельзя ли как то по подробнее узнать технические моменты создания и посмотреть как выглядит сайт в готовом виде. .мой адрес kangad@mail.ru Валентина
спасибо, Валентина, на канале есть видео про этот курс, самое первое видео, трейлер канала, там можно посмотреть, подробнее рассказать не могу так как нет времени
Очень сложно воспринимать из-за музыки...психодел! Но досмотреть хочется)
Спасибо за информацию конечно, но все можно было уместить в 10 минут.
Согласен. Но сложно заранее пытаться уложиться в конкретное время. По крайней мере мне, мало опыта
музыка громкая бъет по ушам
интонация как у уставшего героя
)))
Вообще не объясняет автор, почему нельзя или можно
А необъясняю потому, что рубрика такая, если хотите объяснений то зайдите в плей лист практика там длинные видео с очень подробными объяснениями
WebDesign lessons хорошо, спасибо, обязательно посмотрю👍
Нурсултан, я затупил) не сможете посмотреть так как про бутстрап объяснений нет) я думал что коммент оставлен под другим видео. Дело в том, что объяснять особо нечего, тут просто идут особенности верстки уже, нам это не особо важно, просто примите как факт. Но если хотите более подробно узнать, то почитайте сами об этом обязательно!!! Если в двух словах, то это особенности верстки
Большое спасибо!
пожалуйста!
Спасибо!
Спасибо !
пожалуйста!