搭建项目小记 02 唱片部分

• 背景的设置 ，可以自己用 styled.components 设计一个组件
  • 定位设置成 fixed
  • background-size 设置为 cover
  • filter 透明度自己设置
  • width 100% height 100%（在父元素是body的情况下）

const FullScreenWrap = styled.div<{ bg: string }>`
background-image: ${(props) => `url(${props.bg})`}; 
position: fixed;  
background-repeat: no-repeat; 
background-size: cover;  
transform: scale(1.2);   
filter: blur(80px) brightness(0.6);    
top: 0;   
left: 0; 
width: 100%;  
`

• 高亮样式的设置

• 唱片转圈部分（包括指针转动部分）

唱片部分包括着指针，因为指针的转动和唱片的转圈是一起开始，一起结束的，所以 可以给两者共同的父元素设置一个类名，开始时 ，加上类名 ，结束时 ，去掉类名。

然后设置转动的样式 ：把转动的样式放在 这个给父元素添加的类名里面。