gpt4 book ai didi

CSS3 框阴影仅在左上角和右上角

转载 作者:太空宇宙 更新时间:2023-11-03 18:37:22 25 4
gpt4 key购买 nike

我需要为客户创建此阴影效果,但不知道如何完成:

enter image description here

这甚至可以用纯 CSS 实现吗?

编辑:这是我当前的 CSS:

box-shadow: 0 0px 0px #fff, 
0 -1px 15px #ccc,
0 0px 0px #fff,
0 0px 0px #fff;

-webkit-box-shadow: 0 0px 0px #fff,
0 -1px 15px #ccc,
0 0px 0px #fff,
0 0px 0px #fff;

-moz-box-shadow: 0 0px 0px #fff,
0 -1px 15px #ccc,
0 0px 0px #fff,
0 0px 0px #fff;

最佳答案

我从 Another Stack OverFlow Question 窃取的另一个答案

使用点差值...

box-shadow 有以下值

box-shadow: x y blur spread color;

所以你可以使用类似...

box-shadow: 0px -10px 10px -10px black;

这是同一个问题的另一个答案

您可以为 box-shadow 属性赋予多个值 例如

-moz-box-shadow: 0px 10px 12px 0px #000,
0px -10px 12px 0px #000;
-webkit-box-shadow: 0px 10px 12px 0px #000,
0px -10px 12px 0px #000;
box-shadow: 0px 10px 12px 0px #000,
0px -10px 12px 0px #000;

它只是左右阴影,您可以根据自己的需要进行调整

编辑

我在看 OP 的帖子,我想如果你试过这个,

box-shadow: 0 0px 0px #fff, 
0 -1px 15px #ccc,
0 0px 0px #fff,
0 -1px 15px #ccc;

我认为它应该按照您的想法显示。

我假设值按顺时针顺序排列,例如边框或边距或其他任何内容,

Attribute: top, right, bottom, left;

并且您应该能够像在右侧一样向左侧添加一个值。不过,您可能需要稍微尝试一下。

关于CSS3 框阴影仅在左上角和右上角,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18409717/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com