diff --git a/css/index.css b/css/index.css index d3867f1..30492b8 100644 --- a/css/index.css +++ b/css/index.css @@ -1,30 +1,47 @@ /* banner */ .banner-cont { + position: relative; width: 100%; + overflow: hidden; } .banner-cont .swiper-slide { + position: relative; height: 500px; width: 100%; background: linear-gradient(0, #f7f9fa, #f9fafb); } .banner-cont .swiper-slide .img { - /* position: absolute; */ - z-index: -1; - max-height: 100%; - max-width: 100%; + display: block; width: 100%; - /* object-fit: fill; */ + height: 100%; + max-width: 100%; + max-height: 100%; + object-fit: cover; } +/* 轮播文字层:居中偏左覆盖在图片上 */ +.banner-cont .swiper-slide .section-content { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + max-width: 640px; +} + +.banner-cont .swiper-slide h1 { + font-size: 40px; + line-height: 1.2; + color: #111827; +} .banner-cont .banner-desc { font-size: 16px; margin-top: 30px; - margin-bottom: 80px; + margin-bottom: 40px; max-width: 550px; - + color: rgba(0, 0, 0, 0.75); } /* 轮播文案标签(标题上方的小圆角标签) */