在 IE11 中计算百分比
Calc percentage in IE11
有没有办法让 css calc
函数在 IE11 中使用如下偏移量?
这在 IE11 中不起作用:
div:nth-child(1) {
background: hsl(114.54545, 44%, calc(55.88235% * 1.1));
}
静态百分比:
div:nth-child(2) {
background: hsl(114.54545, 44%, 55.88235%);
}
你可以尝试使用额外的白色层来近似它来增加亮度而不需要 calc()
div:nth-child(1) {
background: hsl(114.54545, 44%, calc(55.88235% * 1.1));
}
div:nth-child(2) {
background: hsl(114.54545, 44%, 55.88235%);
position:relative;
z-index:0;
}
div:nth-child(2):before {
content:"";
position:absolute;
z-index:-1;
top:0;
left:0;
right:0;
bottom:0;
background:rgba(255,255,255,0.1);
}
<div>calc</div>
<div>static</div>
你也可以用多个背景来做:
div:nth-child(1) {
background: hsl(114.54545, 44%, calc(55.88235% * 1.1));
}
div:nth-child(2) {
background:
linear-gradient(rgba(255,255,255,0.1),rgba(255,255,255,0.1)),
hsl(114.54545, 44%, 55.88235%);
}
<div>calc</div>
<div>static</div>
有没有办法让 css calc
函数在 IE11 中使用如下偏移量?
这在 IE11 中不起作用:
div:nth-child(1) {
background: hsl(114.54545, 44%, calc(55.88235% * 1.1));
}
静态百分比:
div:nth-child(2) {
background: hsl(114.54545, 44%, 55.88235%);
}
你可以尝试使用额外的白色层来近似它来增加亮度而不需要 calc()
div:nth-child(1) {
background: hsl(114.54545, 44%, calc(55.88235% * 1.1));
}
div:nth-child(2) {
background: hsl(114.54545, 44%, 55.88235%);
position:relative;
z-index:0;
}
div:nth-child(2):before {
content:"";
position:absolute;
z-index:-1;
top:0;
left:0;
right:0;
bottom:0;
background:rgba(255,255,255,0.1);
}
<div>calc</div>
<div>static</div>
你也可以用多个背景来做:
div:nth-child(1) {
background: hsl(114.54545, 44%, calc(55.88235% * 1.1));
}
div:nth-child(2) {
background:
linear-gradient(rgba(255,255,255,0.1),rgba(255,255,255,0.1)),
hsl(114.54545, 44%, 55.88235%);
}
<div>calc</div>
<div>static</div>