我有两页：登陆和回家。我想为两个页面设置不同的容器宽度，@ gutter-width和@ column-width。怎么做到这一点？
我使用较少的框架并连接所有较少的文件，同时构建要部署到生产的代码。现在，一个页面的样式正在影响其他页面。
答案 0 :(得分：1)
您可以像这样改变装订线宽度（3％装订线的示例）
.alt-grid .row {margin-left:-1.5%;margin-right:-1.5%;}
.alt-grid [class*="col-"] {padding-left:1.5%;padding-right:1.5%}
<强> HTML
<body class="alt-grid">
然后所有[class*="col-"]和所有.row都会受到影响。
上面的示例是将alt-grid类放在.row > .col-*-*上的正文或容器上，但您也可以将其放在.row本身...
<div class="row alt-grid">...</div>
<强> CSS
.alt-grid.row {margin-left:-1.5%;margin-right:-1.5%;}
.alt-grid [class*="col-"] {padding-left:1.5%;padding-right:1.5%}
。容器宽度也可以调整：
<div class="container">...</div>
.alt-grid .container { /* assumes that the .alt-grid is on the body or html tag*/
width:100%;
max-width:1600px;
}
如果您在调整后的.container左侧和右侧添加填充，则必须等于.row页边距的负值。对于此示例，左侧和右侧必须至少填充1.5％。 15px填充是默认值，在此示例中它不会干扰。如果你没有与行上的负边距相同或更多的填充，水平条将自然显示出来。