* { margin: 0; padding: 0 } html { height: 100%; } li { list-style: none } a { text-decoration: none; color: #000; } img { vertical-align: top; border: none } body { width: 100%; height: 100%; } /* 头部 */ .header { width: 100%; height: 70%; background: url('../../../Controls/Office/Word/image/图层 4@2x.png') no-repeat; background-size: cover; /* overflow: hidden; */ } .main { width: 76%; min-width: 1024px; height: 100%; margin: 0 auto; /* overflow: hidden; */ } .logo { width: 20%; height: 11.07%; padding-top: 4%; margin-left: 4%; } .logo .logoimg { width: 3vw; } .logo img { width: 100%; } .logo div { font: 1.2vw MicrosoftYaHei; font-weight: 400; color: rgba(255, 254, 254, 1); float: left; line-height: 3.1vw; margin-left: 2%; } .main .intro { width: 100%; text-align: center; margin-top: 5%; } .main .intro .text { font-size: 3.2vw; font-family: MicrosoftYaHei; font-weight: 400; color: rgba(255, 254, 254, 1); } .main .intro span { font-family: MicrosoftYaHei; } .main .intro .text1 { font-size: 1.4vw; font-family: MicrosoftYaHei; font-weight: 100; color: rgba(255, 254, 254, 1); margin-top: 2.3%; letter-spacing: .1vw; } .main .intro .download { display: block; width: 15vw; height: 5.6vh; border: .2vw solid rgba(255, 255, 255, 1); border-radius: 3vw; margin: 2.3vw auto; font: 1.4vw/5.6vh MicrosoftYaHei; font-weight: 400; color: rgba(255, 254, 254, 1); letter-spacing: .4vw; } .main .intro .download:hover{ background-color: #3e87c7; border-color: #3e87c7; } .header .editor { margin: 3vw auto; min-width: 1024px; text-align: center; } .header .editor img { width: 70%; } /* 性能 */ .property { width: 100%; height: 55%; margin-top: 27%; background: RGBA(75, 173, 243, 1); text-align: center; } .promain { width: 68%; min-width: 1024px; height: 100%; margin: 0 auto; font-weight: 400; color: rgba(255, 254, 254, 1); overflow: hidden; } .promain .ptext { font-size: 2.3vw; font-family: MicrosoftYaHei; margin-top: 5%; letter-spacing: .4vw; } .promain .ptext2 { font-size: 1.2vw; font-family: MicrosoftYaHei; margin-top: 2vw; } .promain ul { width: 82%; height: 25%; margin: 7% auto; } .promain ul li { display: block; width: 13%; float: left; margin-left: 15.3%; font: 1.1vw/4.3vw Micosoft Yahei; letter-spacing: .1vw; } .promain ul li img { width: 50%; } /* 体积 */ .bulk { width: 100%; height: 60%; background: RGBA(246, 246, 246, 1); } .bulkmain { width: 76%; min-width: 1024px; height: 100%; margin: 0 auto; overflow: hidden; } .bulk img { width: 38%; float: left; margin-top: 6.5%; margin-left: 8%; } .bulktext { width: 45%; height: 20%; text-align: right; float: left; margin-top: 16%; } .bulktext div:nth-child(1) { font-size: 2.5vw; font-family: MicrosoftYaHei; font-weight: 400; color: rgba(51, 51, 51, 1); letter-spacing: .3vw; } .bulktext div:nth-child(2) { font-size: 1.5vw; font-family: MicrosoftYaHei; font-weight: 400; color: rgba(51, 51, 51, 1); line-height: 3vw; margin-right: 1%; } /* 速度 */ .speed { width: 100%; height: 60%; background: RGBA(249, 252, 255, 1); } .spmain { width: 76%; min-width: 1024px; height: 100%; margin: 0 auto; overflow: hidden; } .sptext { width: 37%; height: 20%; float: left; margin-top: 15%; margin-left: 10%; } .sptext div:nth-child(1) { font-size: 2.5vw; font-family: MicrosoftYaHei; font-weight: 400; color: rgba(51, 51, 51, 1); letter-spacing: .4vw; } .sptext div:nth-child(2) { font-size: 1.3vw; font-family: MicrosoftYaHei; font-weight: 400; color: rgba(51, 51, 51, 1); line-height: 1.7rem; margin-top: 3%; } .speed img { float: left; width: 38%; margin-top: 4.5%; margin-left: 10%; } /* 效率 */ .efficiency { width: 100%; height: 60%; background: RGBA(246, 246, 246, 1); } .effmain { width: 76%; min-width: 1024px; height: 100%; margin: 0 auto; overflow: hidden; } .efficiency img { float: left; width: 32%; margin-top: 3.5%; margin-left: 10%; } .efftext { width: 40%; height: 20%; text-align: right; margin-top: 16.5%; float: left; margin-left: 5%; } .efftext div:nth-child(1) { font-size: 2.5vw; font-family: MicrosoftYaHei; font-weight: 400; color: rgba(51, 51, 51, 1); letter-spacing: .5vw; line-height: 3vw; } .efftext div:nth-child(2) { font-size: 1.5vw; font-family: MicrosoftYaHei; font-weight: 400; color: rgba(51, 51, 51, 1); line-height: 2.5vw; margin-right: 1%; } /* video */ .video { width: 78%; position: absolute; left: 0; right: 0; margin: 4% auto; text-align: center; } .video img { width: 70%; } /* 底部 */ .footer { width: 100%; height: 28%; background: RGBA(18, 104, 179, 1); margin-top: 32%; overflow: hidden; padding-top: 6.5%; } .footer .download { display: block; width: 17vw; height: 6vh; border: .2vw solid rgba(255, 255, 255, 1); border-radius: 3vw; margin: 0 auto; font: 1.5vw/6vh MicrosoftYaHei; font-weight: 400; color: rgba(255, 254, 254, 1); letter-spacing: .5vw; text-align: center; } .footer .download:hover { background-color: #3e87c7; border-color: #3e87c7; } .footer .ftext { width: 60%; margin: 1% auto; text-align: center; font-size: 1vw; font-family: MicrosoftYaHei; font-weight: 400; color: rgba(255, 255, 255, 1); line-height: 3vw; letter-spacing: .1vh; } .footer .ftext span { margin-left: 3%; }