CSS3箱子影子尺寸按百分比

是否可以通过百分比设置箱子影子尺寸和偏移量？我目前使用这样一类的，但变焦式改变其大小和距离：CSS3箱子影子尺寸按百分比

.shadowright 
    { 
     -webkit-box-shadow: 5px 5px 10px #454545; 
     -moz-box-shadow: 5px 5px 10px #454545; 
     -o-box-shadow: 5px 5px 10px #454545; 
     box-shadow: 5px 5px 10px #454545;    
    }

来源

2014-07-08 iSofia

我不明白你在问什么，如果你放大它放大一切，你会想要发生什么？ – Banana

hmmm ..从来没有尝试过使用百分比来做到这一点。您是否尝试过使用媒体查询？ –

放大对我来说似乎没有任何奇怪的地方。它只是像所有其他事物一样扩展。 – ajp15243

号作为每W3C Specification：

计算值：任何<length>制成绝对;任何指定的颜色计算;否则如指定

强调我的。相对值（百分比）不起作用。

来源

2014-07-08 19:08:48 TylerH

EM不是相对单位吗？ – iSofia

@iSofia好问题。简答：不。长的回答：'EM'是可扩展的，但它在相同意义上不是相对的。 “EM”固定为当前字体大小。如果更改字体大小，则会重新声明EM。根据定义，百分比总是与其他事物相关，并且不能独立存在。相反，'1em'默认等于'12px'（font-size）。换句话说，'EM'是一个变量。 – TylerH

你是对的;谢谢你的回答。它的作用是因为JavaScript函数在客户区域重新调整大小时重新调整字体的大小。尽管如此，仍然可以接受。 – iSofia

为了我想到的更好的解决方案，Google正在寻找一个可能的解决方案。

.shadowright 
{ 
    width: 20%; 
    font-size: 20vw; // if you want the box-shadow to equal it's width 
    box-shadow: 1em 1em 1em red; 
}

来源

2017-10-17 17:48:47 Lemnis

我误解了什么吗？我知道你的情况下box-shadow是20vw的偏移量，但20vw不等于20％。你为什么说“如果你想要盒子的阴影等于它的宽度”？顺便说一句，我认为，原来的@iSofia问题，只要将em分配给box-shadow，假设他或她希望它是“相对于字体大小”就是正确的。 – Eric

CSS3箱子影子尺寸按百分比

回答

相关问题