”`markdown# 网站介绍

这是一个基于Bootstrap创建的轮播图网站。通过使用Bootstrap的Carousel组件，我们可以轻松地创建一个具有高度可定制性和响应性的图片轮播效果。这个网站包含了一些关键的CSS样式规则，用于实现轮播图的各种功能和效果。

CSS样式规则

  • .carousel-inner .item img { width: 100%; height: 100%; }:设置轮播图中每个图片的宽度和高度为100%,以确保图片能够填充满整个轮播项。
  • .banner { height: 900px; }:设置轮播图的容器高度为900像素。
  • #carousel-example-generic, .carousel-inner, .item { height: 100%; }:设置轮播图的容器、轮播项和图片的高度为100%。
  • .jc_imgs_box .active { border : 2px solid #000 !important; }:设置当前活动的轮播项的边框为2像素宽的黑色实线。
  • .in_left_big_box { width: 75%; display: none; }:设置一个大盒子的宽度为75%,默认状态下不显示。
  • .in_left_big_box:nth-child(1) { display: block; }:将第一个大盒子设为可见。
  • .swiper-container { width: 100%; height: 100%; }:设置轮播图的容器宽度和高度都为100%。
  • .swiper-slide { text-align: center; font-size: 18px; background: #fff; /* Center slide text vertically */ display: -webkit-box