如何查看SwiperJS官网CSS Mode Demo的源代码？

• 浏览器开发者工具直接提取
  打开目标Demo页面后按下F12启动开发者工具：
  1. 切换到「元素」面板，定位到Demo对应的swiper容器节点，可以直接复制完整的HTML结构
  2. 切换到「源」面板，筛选当前页面加载的CSS、JS资源，提取和CSS Mode相关的样式与初始化代码
  3. 直接在控制台输入console.log(swiper)即可打印当前Demo的完整实例配置，所有参数都可以直接复用
• 官方开源仓库提取
  Swiper所有官网Demo的源码都同步存放在官方开源仓库的demo目录下，直接搜索「css mode」关键词就能找到对应示例的完整HTML、CSS、JS实现代码
• 官方文档示例复用
  CSS Mode的核心配置非常简单，只需要在Swiper初始化时开启cssMode: true参数即可，基础实现代码如下：

  <link rel="stylesheet" href="swiper/css">
  <script src="swiper/js"></script>
  
  <div class="swiper mySwiper">
    <div class="swiper-wrapper">
      <div class="swiper-slide">Slide 1</div>
      <div class="swiper-slide">Slide 2</div>
      <div class="swiper-slide">Slide 3</div>
      <div class="swiper-slide">Slide 4</div>
    </div>
    <div class="swiper-pagination"></div>
  </div>
  

  var swiper = new Swiper(".mySwiper", {
    cssMode: true,
    pagination: {
      el: ".swiper-pagination",
    },
    mousewheel: true,
    keyboard: true,
  });
  

内容的提问来源于stack exchange，提问作者BananaSweden