12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697 |
- .body {
- display: flex;
- flex-direction: row;
- height: 100vh;
- width: 100vw;
- box-sizing: padding-box;
- }
- .left {
- width: 35%;
- height: 100%;
- display: flex;
- justify-content: center;
- align-items: center;
- background-image: url('../../Content/Image/Stu/yuanhu.png');
- background-size: 100% 100%;
- img {
- margin-top: -5%;
- width: 80%;
- }
- }
- .right {
- width: 65%;
- height: 100%;
- display: flex;
- justify-content: center;
- align-items: center;
- position: relative;
- img {
- animation: spin 8s linear infinite;
- height: 60%;
- }
- }
- .text-box {
- position: absolute;
- width: auto;
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- margin-top: -2%;
- .name {
- font-size: 36px;
- font-weight: 600;
- color: #fff;
- background: #11998e;
- padding: 15px 100px;
- letter-spacing: 10px;
- padding-right: 90px;
- border-radius: 50px;
- }
- .wait-text {
- font-size: 90px;
- font-weight: 600;
- color: #3c3c3c;
- letter-spacing: 20px;
- margin-top: 50px;
- padding-right: 20px;
- }
- }
- /*@media(min-device-width:1025px) {
- .right img {
- height: auto;
- }
- }*/
- @keyframes spin {
- 0% {
- transform: rotate(0deg);
- }
- 35% {
- transform: rotate(180deg);
- }
- 50% {
- transform: rotate(180deg);
- }
- 85% {
- transform: rotate(360deg);
- }
- 100% {
- transform: rotate(360deg);
- }
- }
|