如何有效使用无框网格? [英] How to effectively use the Frameless grid?
问题描述
我也开始建立一个适用于移动设备的网站.因此，我也开始研究媒体查询和各种网格框架.我查看了所有主要参与者"，例如Inuit.css，语义网格等.发现可能对我来说最好的是
I'm starting building a website good for mobile devices too. So I'm also starting studying media queries and the various grid frameworks. I've taken a look to all the 'main players' like Inuit.css, the semantic grid etc.. and found that probably the best one for me is the frameless grid
作者说这是" Less Framework 的精神继任者":
The author says it's 'the spiritual successor to Less Framework':
好的.我已经研究了framelessgrid.com主页面上的所有less/css代码和html代码(应该实现无框架网格)，但是我无法搞清楚如何真正实现它.
Ok. I've studied a lot all the less/css code and html code of the main framelessgrid.com page (that should implement the frameless grid) but I can't fugure out how really I can implement it.
-
首先，他所说的无框架"到底是什么意思?仅仅是说这不是一个框架? 除了具有自由的列宽和倒置"的媒体查询为移动优先"之外，它与lessframework有何不同?
First of all, what does he exactly mean by 'frameless'? Simply that it's not a framework? And apart of having free column widths and 'inverted' media queries to be 'mobile first', how does it differs from lessframework?
我应该如何准确地使用.less变量(尤其是@cols系列)?
How should I exactly use the .less variables (particularly the @cols series)?
按列而不是逐像素调整"的含义.意思是?一个人应该如何将这一概念付诸实践?
What does 'Adapt column by column, not pixel by pixel.' mean? How should one put this concept in practice?
:)
推荐答案
我终于在使用无框架网格，所以我想回答我自己的问题:
I'm finally using the frameless grid, so I want to answer my own questions:
-
不知道:P我的意思是，那个名字，不知道.没关系，..(我也邀请了无框架网格作者在这里回答，但他没有.)
Don't know :P I mean, that name, don't know. It doesn't matter, though.. (I also invited the frameless grid author to answer here, but he didn't.)
@cols变量.我认为基本上，它们是无框网格.好吧，它们不是，因为无框网格只是一个"主意.但是实际上，这是与标准"方法相对应的主要CSS差异.您只需在列中定义元素的宽度即可，而不是像素.就这样.当然，这只能使用Less或Sass来完成.由于我对scss的了解不多，所以我无法完全理解主要思想.
您最终会说一个元素是8列宽，另外5列宽，依此类推.比计算像素要简单得多.
The @cols vars. I think that basically, they are the frameless grid. Well, they're not, since the frameless grid is 'only' an idea. But in practice, well, it's the main css difference against 'standard' approach. You simply define the width of elements in columns instead of pixels. That's all. This, of course, can be done only using Less or Sass. Since I didn't know less and scss, I couldn't fully undestand the main idea.
You'll end up saying that an element is 8 columns wide, another 5 columns wide, etc.. Much more simple than calculating pixels.
请参阅答案2:P
希望这对其他人有帮助.
Hope this will help someone else.
这篇关于如何有效使用无框网格?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
