Как лучше всего реализовать сетку bootstrap 3? Есть два варианта: через классы в html и через less миксины.
Использование классов начальной загрузки в html и bootstrap.css (что кажется стандартным):
<div class="container">
<div class="row">
<div class="column-md-6 column-xs-8">
<p>test</p>
</div>
<div class="column-md-6 column-xs-4">
<div class="row">
<div class="column-md-8 column-xs-6">
<p>Another test</p>
</div>
<div class="column-md-4 column-xs-6">
<p>Yet another test</p>
</div>
</div>
</div>
</div>
</div>
Использование миксинов LESS и bootstrap и соответствующей структуры HTML:
<div id="maincontent">
<div id="maincontentarea">
<div id="blogarticles">
<p>test</p>
</div>
<div id="whatsnew">
<div id="whatsnewarea">
<div id="whatsnewheading">
<p>Another test</p>
<div>
<div id="whatsnewlist">
<p>Yet another test</p></div>
<div>
</div>
</div>
</div>
<div>
и соответствующий МЕНЬШЕ:
#maincontent{
.container();
#maincontentarea{
.make-row();
#blogarticles{
.make-md-column(6);
.make-xs-column(8);
}
#whatsnew{
.make-md-column(6);
.make-xs-column(4);
#whatsnewarea{
.make-row();
#whatsnewheading{
.make-md-column(8);
}
#whatsnewlist{
.make-xs-column(6);
}
}
}
}
}
Звучит как хорошая идея иметь файл .LESS, просто используя миксины начальной загрузки для определения структуры, но это не дублирует по существу структуру элемента в меньшем файле, который уже определен в LESS. Какой из них более ремонтопригоден?
