仅使用CSS制作发光背景

Question

我想仅在CSS中创建此背景。

我想用CSS来避免响应问题。

Answer 1

您可以使用radial-gradient来产生发光效果。您可以将颜色更改为与图像内联。

您应该注意的一件事是浏览器支持CSS渐变。 IE＆lt; 10不支持他们。如果您需要支持旧版浏览器，那么CSS渐变将无济于事。

body {
  background-image: radial-gradient(circle, rgb(49, 144, 228) 0%, rgb(29, 84, 166) 100%);
  height: 100vh;
}

<!-- prefix free library included only to avoid vendor prefixes -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>

我看不到中间的任何额外步骤，但如果您正在寻找不同百分比的几个步骤，那么请查看下面的代码段：

body {
  background-image: radial-gradient(circle, rgb(49, 144, 228) 0%, rgb(41, 122, 204) 30%, rgb(29, 84, 166) 70%);
  height: 100vh;
}

<!-- prefix free library included only to avoid vendor prefixes -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>