4.3.4. styling

根据您拥有的服务数量,为生成的标记添加一些最终连接。在这个示例中有两个,所以 service-column div 的 CSS 代码将是:

.service-column {
    float: left;
    margin-left: 10%;
    width: 45%;
}
.service-column:first-child {
  margin-left: 0;
}

在这个示例中,我们使用基于百分比的布局在包含 div 的尺寸上动态地分配该列基础的宽度。

现在,您应该已拥有一个正常工作且看好的多个服务订阅页面。恭喜!

如果您想以特定顺序显示列,请尝试使用条件表达式(if/else/case)条件条件表示服务名称或其他您已知的值。