是";单位相关“;CSS属性值,其前缀为0,与相应的;“不带零前缀”;价值观

是";单位相关“;CSS属性值,其前缀为0,与相应的;“不带零前缀”;价值观,css,units-of-measurement,octal,equivalence,Css,Units Of Measurement,Octal,Equivalence,我正在扫描一些样式表,这时我注意到一个样式表使用了线性渐变和rgba()颜色停止,rgba数字使用了0的多个实例,而不仅仅是一个0: background-image:linear-gradient(to top left, rgba(000,000,000,0.1),rgba(100,100,100,1)); 我以前没有看到多个零(而不是一个零)占据rgb/a颜色空间中的单个插槽,但在CodePen上确认这是有效的。然后我查阅了W3C对编号的定义 长话短说,经过更多的戳和挖掘,我没有意识到我

我正在扫描一些样式表,这时我注意到一个样式表使用了
线性渐变
rgba()
颜色停止,
rgba
数字使用了0的多个实例,而不仅仅是一个0

background-image:linear-gradient(to top left, rgba(000,000,000,0.1),rgba(100,100,100,1));
我以前没有看到多个零(而不是一个零)占据rgb/a颜色空间中的单个插槽,但在CodePen上确认这是有效的。然后我查阅了W3C对编号的定义

长话短说,经过更多的戳和挖掘,我没有意识到我可以将不确定数量的零预先设置为长度,并得到与没有预先设置零相同的结果,如下所示:

/* The two squares generated have equivalent width and height of 100px - for giggles, I also extended the same idea to the transition-duration time */

<style>

div.aaa {
    width:00000000100px;
    height:100px;
    background-image:linear-gradient(to top left,rgba(000,000,000,0.1),rgba(100,100,100,1));
    transition:1s cubic-bezier(1,1,1,1)
}

div.bbb {
    width:100px;
    height:000000000000000000000000000000000100px;
    background-color:green;
    transition:0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000001s cubic-bezier(1,1,1,1)
}

div:hover { background-color:red } 

</style>

<div class="aaa"></div>
<div class="bbb"></div>
这些示例向我表明,CSS并不将例如0000100视为八进制数,而是将其视为十进制数(或至少视为非八进制数),因为上面生成的html元素的
宽度
高度
转换持续时间
的大小似乎是相同的

将此CSS方法扩展到任何属性和任何单位,例如,时间
任何包含CSS属性值的单元在语法上是否等于没有任何前缀的相同值?

我必须承认我发现这个问题很有趣

css 2语法规范说明:

num     [0-9]+|[0-9]*\.[0-9]+
请注意,0000000000000000 37.3符合此规则和定义,它是一系列介于0和9之间的数字,可以选择后跟一个。还有一系列从0到9的数字

css 3规范继续:

4.2。实数:类型

数值由
表示,表示实数, 可能有一个分数分量

按字面意思写时,数字要么是整数,要么是零或更多 小数位数后跟一个点(.),后跟一个或多个小数 数字和可选的由“e”或“e”和 整数。它对应于CSS中的产品 语法模块[CSS3SYN]。与整数一样,数字的第一个字符 数字前面可以紧跟-或+以指示数字的位置 签字

我相信这大致解释了css解析器应该如何获取css值并将其转换为数字:

4.3.13。将字符串转换为数字

本节介绍如何将字符串转换为数字。信息技术 返回一个数字

注意:此算法不进行任何验证以确保 字符串只包含一个数字。确保该字符串仅包含 调用此算法之前的有效CSS编号

将字符串按从左到右的顺序分为七个部分:

符号:单个U+002B加号(+)或U+002D连字符(-)或空字符串。如果符号为U+002D,则设为数字-1 连字符(-);否则,让我们成为数字1

整数部分:零或多个数字。如果至少有一个数字,那么我是通过将数字解释为 以10为基数的整数;否则,让我是数字0

小数点:单个U+002E句号(.)或空字符串

小数部分:零或多个数字。如果至少有一个数字,则f是通过将数字解释为a而形成的数字 以10为基数的整数,d为位数;否则,设f和d 是数字0

指数指示器:单个U+0045拉丁字母大写字母E(E)或U+0065拉丁字母小写字母E(E),或空字符串。 (-),或空字符串。如果 符号为U+002D连字符负(-);否则,让t为数字1

指数:零个或多个数字。如果至少有一个数字,则e是通过将数字解释为基数10而形成的数字 整数;否则,将e设为数字0

返回数字s·(i+f·10-d)·10te

我认为关键术语是一个基数为10的数字

请注意,对于起始0有意义的其他可能情况,如果我正确阅读本规范,我相信您必须对其进行转义,以使其作为简单数字以外的其他数字发挥作用:

任何Unicode代码点都可以包含在标识符中或引用 通过转义字符串。CSS转义序列以反斜杠开始 (\),然后继续:

非十六进制数字或换行符的任何Unicode代码点。转义序列将替换为该代码点

或一到六个十六进制数字,后跟可选空格。转义序列由值为的Unicode代码点替换 由十六进制数字给出。此可选空白允许 十六进制转义序列后跟“实”十六进制数字

值为“&B”的标识符可以写为\26 B或\000026B

转义序列后的“真实”空间必须加倍

然而,即使在这里,开始0也是可选的,尽管它不是非常清晰

CSS规范虽然迟钝,但却相当清晰,但情况并非总是如此。是的,数字是由数字串组成的,也可以有小数,以10为底,这意味着前导的零就是零

我还推测,因为规范进一步声明,当数值为0时,不需要任何单位,事实上,前导零在内部可能意味着null,nothing,尽管很明显,您必须查看css解析代码本身,以了解浏览器实际如何处理它

这很有趣。我认为这可能是因为css是一种非常简单的语言,它不会像php或javascript那样用前导零做“聪明”的事情,它只是做你所期望的,把它们当作零,什么都不做

不过还是谢谢你的邀请
num     [0-9]+|[0-9]*\.[0-9]+