我认为当我们使用百分比值进行CSS3变换转换时,这个百分比是相对于它自己的宽度或高度的,所以(50%,75%)意味着它自己宽度的50%,它的75%自己的高度,但我找不到任何说明的规格.
示例:https://jsfiddle.net/cstsyw3s/1/
使用:
transform: translate(100%, 100%)
我查看了http://www.w3.org/TR/css3-transforms但在那里找不到它 - 我只能找到例如transform-origin
"百分比:参考边界框的大小",以及我认为边界框可能是带有元素宽度和高度的矩形.(不包括任何边框)...但除了SVG和表格之外,我找不到边界框的定义.
在本节http://www.w3.org/TR/css3-transforms/#transform-property中,它指出:
百分比:参考边界框的大小
边界框的定义是(源)
边界框是所有SVG元素的对象边界框,没有关联的CSS布局框和所有其他元素的边框.表的边界框是其表包装盒的边框,而不是其表框.
边框是(来源)
宽度和高度属性包括填充和边框,但不包括边距.请注意,填充和边框将位于框内,例如.box {width:350px; border:10px solid black;}导致在浏览器中呈现的宽度为350px的框.
我希望这有帮助