不需要的邊界半徑偽影，帶有框陰影擴散

Question

目標是一個邊緣柔和的無邊界圓圈，包含文本或其他元素。 如何擺脫以下示例中的細黑色邊框線？ 我嘗試添加具有相同或透明顏色的邊框。 它可以用 1px x 1px 和大的傳播來完成，但我想把東西放進去。

 body { background: black; } div { width: 50px; height: 50px; margin: 50px; padding: 50px; border-radius: 50%; background: white; box-shadow: 0 0 10px 10px white; }

 <div>some text</div>

Answer 1

使用radial-gradient()

 body { background: black; } div { width: 50px; height: 50px; margin: 50px; padding: 70px; border-radius: 50%; background: radial-gradient(farthest-side,white calc(100% - 15px),transparent ); }

 <div>some text</div>