Another week full of hope

    It was another week full of hope. Most of the time this week was spent on final review. I didn’t dare to go to bed during early reading. I was always studying English (I was very afraid of losing my English subject). We have said that if you drop a subject once, it will affect your four years of university. More than that, after you drop a subject, there will be corresponding penalties for both the student union and the group. Next step into the topic, talk about this week.
    The group study
    page has been assessed, and I feel that when I put my page on my own page, I am fine. Fortunately, I am not nervous at all (I was very nervous before). Effective.
    Because the recent learning is CSS3 animation learning, but I chose to imitate the official website of Huawei, which has relatively few animation effects, so I found a 3D background on the Internet. The code and comments are as follows:
CSS part

			*{
			margin:0;padding:0;
			}
			background {
				position: fixed;/*让他绝对定位,让子类始终在窗口的中间*/
				width: 100%;
				height: 100%;
				overflow: hidden;
			}
			
			.background .rotate {
				position: absolute;/*绝对定位,让旋转的东西始终在页面正中间*/
				top: 50%;
				margin-top: -200px;
				left: 50%;
				margin-left: -200px;
				width: 400px;
				height: 400px;
				transform-style: preserve-3d;
				/*让子元素位于3D空间中,这个元素是设置在父级元素中的*/
				animation: rotate 20s linear infinite;
				zoom: 4.2;
				/*放大为原来的4倍*/
			}
			
			@keyframes rotate {/*动画效果,让3个DIV旋转360度*/
				0% {
					transform: rotateX(0deg)rotateY(0deg);
				}
				100% {
					transform: rotateX(360deg)rotateY(360deg);
				}
			}
			
			.background .rotate .sphere {
				position: absolute;
				width: 100%;
				height: 100%;
				transform-style: preserve-3d;
			}
			
			.background .rotate .sphere span {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				transform-style: preserve-3d;
				background: radial-gradient(#ccc, #fff);/*径向渐变,从灰色到白色*/
				border-radius: 50%;/*变圆*/
			}
			/*形成一个类似于雪花的形状*/
			.background .rotate .sphere:nth-child(2) {
				transform: rotate(90deg);
			}
			
			.background .rotate .sphere:nth-child(1) {
				transform: rotate(45deg);
			}
			
			.background .rotate .sphere:nth-child(3) {
				transform: rotate(-45deg);
			}
			//让六个span有着不同的角度
			.background .rotate .sphere span:nth-child(1) {
				transform: rotateY(0deg);
			}
			
			.background .rotate .sphere span:nth-child(2) {
				transform: rotateY(30deg);
			}
			
			.background .rotate .sphere span:nth-child(3) {
				transform: rotateY(60deg);
			}
			
			.background .rotate .sphere span:nth-child(4) {
				transform: rotateY(90deg);
			}
			
			.background .rotate .sphere span:nth-child(5) {
				transform: rotateY(120deg);
			}
			
			.background .rotate .sphere span:nth-child(6) {
				transform: rotateY(150deg);
			}

html part

<div class="background">
			<div class="rotate">
				<div class="sphere">
					<span></span>
					<span></span>
					<span></span>
					<span></span>
					<span></span>
					<span></span>
				</div>
				<div class="sphere">
					<span></span>
					<span></span>
					<span></span>
					<span></span>
					<span></span>
					<span></span>
				</div>
				<div class="sphere">
					<span></span>
					<span></span>
					<span></span>
					<span></span>
					<span></span>
					<span></span>
				</div>
			</div>
		</div>

Insert picture description here
    
    As the work of the department is preparing for the end of the period, there is very little work in the department recently, and it has been a long time since I saw the seniors in the department. I miss you, it's cold, pay attention to your health, and don't get sick like me.
    The study time in the
    last part of the study is almost given to the C language. Because there was a mock exam before, I did not take it very badly, so I want to make up for it through these few days. As for English, I recently read the translation exercises that have been behind me (I heard that Uehara will come out, hehe). There is also a modern history, which will still be memorized at that time. I just finished the off-campus practical activities of the modern history class today and I have gained a lot of it.
    Ma Yun once said that people must think clearly about three questions: "One, what do you have;" two, "what do you want;" "three, what can you give up". Hope your choice is right.Insert picture description here

Guess you like

Origin blog.csdn.net/weixin_45956597/article/details/103635112