CSS 아날로그 구현 QQ 브라우저

지식 포인트

1. 전체 화면 스크롤 fullpage.js과 결합

2. CSS의 선형 구배 () 함수는 선형 구배 만드는 "이미지."

   background-image: linear-gradient(direction, color-stop1, color-stop2, ...);
   

값	기술
방향	구배 값 (또는 각도)의 방향으로 소요 각도.
색상 STOP1, 색상 STOP2, ...	시작과 끝 그라데이션 색상을 지정하는 데 사용됩니다.

3. 블록 수준 태그 센터

   position:absolute;
   left:50%;
   top:50%;
   margin-left:自身宽度一半;
   margin-top:自身高度一半；
   

   또는 :

   position:absolute;
   left:50%;
   top:50%;
   transform:translateX(-50%) translateY(-50%);
   

4. 메이크업 백 효과 :
   ① 첫째, 박스의 후면 상단의 효과를 더한 부모의 관점 관점 효과
   부모 상자에 변환 - 스타일의 추가 차원 백 효과 효과 다음 보존-3D,
   ② 수단에 의해 받침 숨겨진 속성을 :이면에는 가시성 : 숨겨진
   ③ 애니메이션 효과, 스핀

5. 회전 링 효과
   ① 커스텀 애니메이션
   ② 회전 XYZ 회전 효과의 각도를 조정하도록 구성된

6. 좌절의 효과
   시작은 모든 내용이 클래스 이름을 삭제하는 경우 화면에, 폭파 그래서, 현재의 클래스가 있습니다. 1.5S 내의 모든 애니메이션이 완료되면 그 결과는 헛된 달성했다.
   
   

7. 스크린 혁명과 회전의 세 가지 라인이있다. 는 Y에 대한 회전을 축 ○로하기 때문에, 회전 중심 (Q)의 주위에 회전.

운영 결과