如何在html中添加更多半列，例如0.5,1.5,2..5

Question

我已经创建了一个登录表单，我已经推出了col值

<div class="col l3 offset-l4">

我希望在col中添加0.5个更大的大小，就像这样

<div class="col l3 offset-l4.5">

我怎样才能做到这一点？

Screen Shot Of Form Output

Answer 1

假设您使用Materialize Grid系统，则无法实现。它仅支持整数值。

但是你可以做一个自定义的实现。网格的基本思想是将一行拆分为12列。因此，网格值为4.5意味着12列（4.5 / 12）中的4.5，这导致0.375或37.5％。如果您希望偏移4.5列，则需要为元素添加37.5％的左边距。

所以你需要添加以下CSS（请注意，你不允许在类名中使用一个点）：

.offset-l4-5 {
  margin-left: 37.5%;
}

但我想要摆脱网格系统并为表单编写自己的CSS会更容易。