HTML+CSS画个太阳

G018_star sky♬

于 2022-03-20 21:10:12 发布

阅读量2.3k

点赞数

分类专栏： CSS

本文链接：https://blog.csdn.net/qq_42526440/article/details/123621533

版权

CSS 图形设计径向渐变阴影边框半径

关键词由CSDN通过智能技术生成

CSS 专栏收录该内容

51 篇文章

订阅专栏

基础版

CSS:

html,body{
  margin: 0;
  padding: 0;
}
body{
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: gray;
}
.sun{
  width: 10em;
  height: 10em;
  /* 将正方形四直角改为圆角成 圆 */
  border-radius: 50%;
  /* 为太阳设置外围光辉阴影 */
  box-shadow: 0px 0px 100px #FFFF00;
  /* 为圆从外到内设置颜色 黄色-》红色 */
  background: radial-gradient(circle at center, red, gold);
}