Как правильно пропиывать адаптивные классы для сетки Bootstrap?

Question

[ayapergenov]

Почему на сайте Bootstrap в образцах прописываются классы с именами span4 или span8, а на рабочих проектах используются имена col-md-4 или col-xs-4 или sm или lg? Понимаю что эти классы применяются к экранам разной ширины. От самых маленьких до самых больших.
С какого класса правильно начинать прописывать с наименьшего xs или наибольшего lg?
Прошу ответить на оба вопроса.

Answer 1

[Pavel]

spanX - используется в 2 версии, col-x в 3
getbootstrap.com/css

Comments

[ayapergenov]

А третий Bootsprap поддержиывает классы span?

[Pavel]

ayapergenov: getbootstrap.com/migration :)

Answer 2

[Саша Улыч]

Разницы никакой, если делаешь mobile first то пиши xs , если с десктопа то ms/lg

Comments

[ayapergenov]

Допустим я делаю десктопный проект. Я прописываю col-lg-4. Если же мне надо садаптивить для меньших экарнов. То я подписываю сol-sm-8 и col-xs-12 к примеру. Правильно?

[Саша Улыч]

Дело вкуса, к примеру я делаю с декстопов сначала. то прописую col-md-12 col-sm-12 col-xs-12 , lg не использую этих 3 хватает. Мне просто проще ориентироваться по кода когда col-md- первым идет

[ayapergenov]

Саша Улыч: Где-то читал, что за первоначальное использование col-md человек грозился руки отрывать. Так и не понял, в чем тут проблема.

[Максим]

ayapergenov: ну вообще уж по градации тогда только тут уже дело вкуса. Можно и с xs, а можно с lg.

Answer 3

[Stalker_darkway]

Нужно исходить из требований макета. Вообще сам бутстрап советует сначала с мобильных начинать, но мне удобнее клепать с больших размеров. Надеюсь, что логика колонок вам понятна и с этим вопросов у вас не возникает. У спанов разница в версиях.