我对这个网格概念非常新,我非常习惯:
<header>
<div class="wrap"></div>
</header>
header{width:100;display:inline;min-height:120px;height:100%;}
.wrap{width:960px;display:block;margin:0 auto;padding:0;position:relative;}
现在有了这个新的Heoric尝试用我带来的susy来学习网格;
.den-100{
@include span-columns(12);
}
.den-1r { @include span-columns(1) ;}
.den-2r { @include span-columns(2) ;}
.den-3r { @include span-columns(3) ;}
.den-4r { @include span-columns(4) ;}
.den-5r { @include span-columns(5) ;}
.den-6r { @include span-columns(6) ;}
.den-7r { @include span-columns(7) ;}
.den-8r { @include span-columns(8) ;}
.den-9r { @include span-columns(9) ;}
.den-10r{ @include span-columns(10);}
.den-11r{ @include span-columns(11);}
.den-12r{ @include span-columns(12);}
.den-1c { @include isolate(1) ;}
.den-2c { @include isolate(2) ;}
.den-3c { @include isolate(3) ;}
.den-4c { @include isolate(4) ;}
.den-5c { @include isolate(5) ;}
.den-6c { @include isolate(6) ;}
.den-7c { @include isolate(7) ;}
.den-8c { @include isolate(8) ;}
.den-9c { @include isolate(9) ;}
.den-10c{ @include isolate(10);}
.den-11c{ @include isolate(11);}
.den-12c{ @include isolate(12);}
所以
我能做到:
<header class="den-100">
<aside class="den-3c den-5r></aside>
<aside class="den-8c den-2r"></side>
</header>
它确实像以前的工作流程一样工作,但现在我很困惑,这是SusyGrid的正确方法吗?
响应怎么样?使用断点和display:block将是正确的方法吗?
我将直接进入免费机票。 MayBe Susy文档对我来说太复杂了......
感谢