目录

关于新奇的css

目录

关于新奇的css

background: linear-gradient(154deg, #07070915 30%, hsl(var(–primary) / 30%) 48%, #07070915 64%); filter: blur(100px);

  1. background: linear-gradient(154deg, #07070915 30%, hsl(var(--primary) / 30%) 48%, #07070915 64%);
  • 这是一个线性渐变背景设置,角度为154度。
  • 渐变开始于颜色#07070915(这是一个带有透明度的颜色值,前6位代表颜色,最后两位代表透明度,这里的透明度为20%),并且这个颜色会覆盖从起点到30%位置的区域。
  • 在48%的位置上,颜色变为由hsl(var(--primary) / 30%)定义的颜色,这里使用了HSL颜色模式,并且亮度或饱和度通过变量--primary来动态调整,同时设置了透明度为30%。
  • 最后,在64%的位置之后,颜色再次变为#07070915
  1. filter: blur(100px);
  • 这个属性给整个元素添加了一个模糊效果,模糊半径为100px。这意味着任何在这个元素上的内容都会看起来像是被涂抹开来,创建一种朦胧的效果。 效果是这样的 有兴趣有的小伙伴可以自行试一下 还是好看的 https://i-blog.csdnimg.cn/direct/fc1b78ca8ca14bc7a2ba45521a2d843b.png