Question

在下面的屏幕截图中，您可以看到两个div，其中两个都应用了框阴影。第二个看起来有点不同，但阴影更长，我想找出原因。我正在尝试使其外观与第一个相同。

它们之间的唯一区别是边界半径。我正在macOS 10.14.2上使用Chrome版本71.0.3578.98。我在Safari和Firefox上进行了测试，没有看到此问题。

<html>
<head>
    <style>
        body { 
            background-color: #efefef;
        }
        div {
            box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 
                        0 1px 5px 0 rgba(0, 0, 0, 0.12), 
                        0 3px 1px -2px rgba(0, 0, 0, 0.2);
            padding: 16px;
            margin: 24px;
            background-color: #fff;
        }
        div.one {
            border-radius: 5px 5px 5px 5px;
        }
        div.two {
            border-radius: 0px 0px 5px 5px;
        }
    </style>
</head>
<body>
    <div class="one">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit.Curabitur convallis ut est at tristique.
    </div>
    <div class="two">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur convallis ut est at tristique.
    </div>
</body>
</html>

盒子阴影问题的屏幕截图：

Answer 1

我不知道为什么，但是似乎可以。

v = rand() * (x_max - x_min) / RAND_MAX + x_min;

Chrome Box阴影不一致

1 个答案: