html { height: 100%; } body { height: 100%; min-width: 1200px; min-height: 1000px; } a { text-decoration: none; color: #201f1e; font-weight: normal; } ul { list-style-type: none; } .container { height: 100%; width: 100%; background-size: cover; } @media (min-width: 1200px) { .container { width: 100%; } } @media (max-width: 900px) { .container { width: 900px; } } .container-content { width: 1200px; margin: 0 auto; margin-top: -700px; } .carousel { overflow: hidden; position: relative; width: 600px; height: 400px; } .slides { display: flex; width: 100%; height: 400px; transition: transform 0.5s ease-in-out; } .indicators { position: absolute; bottom: 10px; right: 0; list-style-type: none; padding: 0; margin: 0; z-index: 1000; } .indicators li { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: #9fa1a0; margin-right: 5px; cursor: pointer; } .indicators li.active { background: #fa352c; } .slide { flex-shrink: 0; width: 100%; /* 占据容器的全宽 */ height: 100%; /* 占据容器的全高 */ position: relative; } .slide img { width: 100%; height: 100%; object-fit: cover; } .slide-bg { width: 100%; height: 40px; position: absolute; overflow: hidden; left: 0; bottom: 0; background: #d32d2f; opacity: 0.9; z-index: 1; } .slide-bt { width: 400px; height: 40px; padding: 0 10px; line-height: 40px; font-size: 16px; overflow: hidden; position: absolute; left: 0; bottom: 0; z-index: 15; text-overflow: ellipsis; white-space: nowrap; color: white; } .content { width: 100%; margin: auto; background-color: #fff; padding: 20px; } .content-top { height: 450px; display: flex; justify-content: space-between; } .content-right { width: 567px; } .right-top { height: 48px; background: url(/uploads/image/rdimg/toolbar.png); position: relative; } .more-img { float: right; padding-top: 20px; } .right-content { /* height: 150px; */ } .right-content li { font-size: 16px; font-weight: bold; height: 45px; line-height: 45px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-bottom: 1px dashed #bbbb; } .right-content li:last-child { border-bottom: 0px; } .list-dot { font-size: 10px; color: #d32d2f; vertical-align: middle; padding-bottom: 5px; padding-right: 5px; } .article { display: flex; justify-content: space-between; } .article-content { width: 47%; } .article-one .article-title { width: 100%; height: 48px; background: ; background-size: cover; } .article-two .article-title { width: 100%; height: 48px; background: ; background-size: cover; } .sponsor { margin-top: 50px; display: flex; justify-content: space-around; } .sponsor-item img { width: 128px; height: 47px; } .footer { position: relative; bottom: 0; width: 100%; box-sizing: border-box; padding-top: 20px; text-align: center; color: #4e5465; overflow: hidden; margin-top: -1px; } .footer ul { font-size: 14px; line-height: 30px; padding-bottom: 60px; } .footer ul li { padding: 3px 0; }