html - 使用 css 网格框架重复行/列代码

当使用 CSS 框架的网格系统时，如 Bootstrap或 Materialize例如，我发现自己经常输入以下 HTML:

<div class="row">
    <div class="col s12">
        <!-- Some text/ a button / something -->
    </div>
</div>

基本上我需要将一个元素(比如一个段落或一个按钮)放在页面上它自己的行中，为此我需要三个标签而不是一个。随着时间的推移，这会在我的 HTML 中造成大量膨胀。

我考虑过创建一个 Angular Directive(指令)，使其成为一个额外的标签而不是两个，但我觉得这是一个草率的解决方案。有谁知道解决这个问题的更好方法？

最佳答案

一个选项是创建代码 snippet因此，如果您键入 element，它会在完整的 HTML 中展开，片段可在 sublime text、atom 文本编辑器中使用。

另一个简单的选择是使用emmet，它在前面提到的两个和括号中可用，像这样:

.row>.col.s12>element TAB

关于html - 使用 css 网格框架重复行/列代码，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37214023/