[英]HTML/JS: Setting “100% auto” for background-size property truncates to “100%” but “auto 100%” does not
For a div, why does setting "100% auto" for the background-size property get truncated to "100%" but "auto 100%" does not? 对于div,为什么将background-size属性的“ 100%auto”设置为“ 100%”会被截断,而“ auto 100%”却不会呢?
The goal is to allow "100% auto" for the background-size property. 目标是为background-size属性允许“ 100%自动”。
"100% auto" is different from "100%", isn't it? “ 100%自动”与“ 100%”不同,不是吗?
Codepen: https://codepen.io/anon/pen/xMLXKz?editors=1111 Codepen: https ://codepen.io/anon/pen/xMLXKz ? editors = 1111
<div id="test1"></div>
<div id="test2"></div>
div {
width: 200px;
height: 200px;
background: blue;
}
$("#test1")[0].style["background-size"] = "100% auto";
$("#test2")[0].style["background-size"] = "auto 100%";
console.log($("#test1")[0].style["background-size"]);
console.log($("#test2")[0].style["background-size"]);
console.log("Done")
This outputs: 输出:
"100%"
"auto 100%"
"Done"
As you can check here at MDN - background-size , it clearly says when the second value ( ie height ) is absent, the browser will treat as auto
. 正如您可以在MDN-background-size此处检查的那样,它清楚地说明,如果缺少第二个值(即height),浏览器将视为
auto
。
So, I think it's okay to check for a /\\s/
character in your $("#test1")[0].style["background-size"]
value to check for a space, and if it wasn't there ( RegExp returned -1
) append an auto
to the output to become 100% auto
. 因此,我认为可以在
$("#test1")[0].style["background-size"]
值中检查/\\s/
字符以检查空格,如果不存在(RegExp返回-1
)将auto
附加到输出中以成为100% auto
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.