当前位置:  开发笔记 > 前端 > 正文

CSS3变换是否相对于宽度和/或高度转换百分比值?

如何解决《CSS3变换是否相对于宽度和/或高度转换百分比值?》经验,为你挑选了1个好方法。

我认为当我们使用百分比值进行CSS3变换转换时,这个百分比是相对于它自己的宽度或高度的,所以(50%,75%)意味着它自己宽度的50%,它的75%自己的高度,但我找不到任何说明的规格.

示例:https://jsfiddle.net/cstsyw3s/1/
使用:

transform: translate(100%, 100%)

我查看了http://www.w3.org/TR/css3-transforms但在那里找不到它 - 我只能找到例如transform-origin"百分比:参考边界框的大小",以及我认为边界框可能是带有元素宽度和高度的矩形.(不包括任何边框)...但除了SVG和表格之外,我找不到边界框的定义.



1> cocoa..:

在本节http://www.w3.org/TR/css3-transforms/#transform-property中,它指出:

百分比:参考边界框的大小

边界框的定义是(源)

边界框是所有SVG元素的对象边界框,没有关联的CSS布局框和所有其他元素边框.表的边界框是其表包装盒的边框,而不是其表框.

边框是(来源)

宽度和高度属性包括填充和边框,但不包括边距.请注意,填充和边框将位于框内,例如.box {width:350px; border:10px solid black;}导致在浏览器中呈现的宽度为350px的框.

我希望这有帮助

推荐阅读
郑谊099_448
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有