CSS中值前的点是什么意思？

Question

我正在查看 Angular 2 教程，CSS 中的这个细节引起了我的注意。

“.1em”中的点是什么意思？

.heroes li:hover {
    color: #607D8B;
    background-color: #DDD;
    left: .1em;
  }

Answer 1

它是0.1em 的简写，即。十分之一 em。换句话说，您不限于整数（整数）。

这并不像看起来那么无用。 CSS 最小化器正变得越来越普遍，并将此代码减少到

.heroes li:hover {color:#607D8B;background-color:#DDD;left:.1em;}

.1 之前的前导零只是另一个可以消失的字节。

Answer 2

它的意思是 0.1em，但有些人把它写成 .1em，它是捷径，就像你在数学中使用的那样。

Answer 3

EM 是一个相对于元素字体大小的值。

.1em 是 1em 的 10%

没有CSS： 1em == 16px

如果字体大小发生变化，1em = 新的字体大小值。

Answer 4

点实际上表示 0。CSS 将点后面的数字作为 1 的小数。例如.1 = 0.1 或 .3s = 0.3s

所以，下面两个块的作用是一样的：

div {
    transition: all .3s;
}

div {
    transition: all 0.3s;
}

哪个结果是 300 毫秒或 0.3 秒。