亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

我正在使用 Bootstrap 5 製作網(wǎng)站，但 index.css 屬性未應(yīng)用於 index.html。當(dāng)我將滑鼠懸停在服務(wù)卡上時(shí)，背景應(yīng)該會發(fā)生變化，從而產(chǎn)生過渡效果。應(yīng)該是從這個(gè)到這個(gè)。但是，我認(rèn)為連結(jié)到 HTML 的 CSS 可能有問題，因?yàn)楫?dāng)我嘗試將網(wǎng)站的背景更改為隨機(jī)顏色時(shí)，該更改不會出現(xiàn)在網(wǎng)站上。

@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');
body {
  background: #f1f2fa;
  font-family: 'Poppins', sans-serif;
}

hr {
  border: 1.5px solid #0b5ed7
}

.crd {
  background-color: #f1f2fa;
  transition: all;
}

.crd:hover {
  background: #0b5ed7;
  color: #fff;
  transition: 0.5s;
}

<link  rel="stylesheet">
<link rel="stylesheet" >
<link rel="stylesheet" >
<link rel="stylesheet" href="/index.css" />
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>

<!-- SERVICES SECTION START -->
<section>
  <div class="container">
    <div class="row py-5">
      <h2 class="display-6 mb-4">Our Services</h2>
      <!-- <div class="col-lg-4 col-md-6">
                    <div class="card text-center p-4 mb-2">
                        <i class="fas fa-camera fa-3x"></i>
                        <h4>CCTV Services</h4>
                        <p class="p-2">
                            Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam
                            voluptatum, voluptate, quibusdam, quia voluptas quod quos
                            exercitationem quae voluptatibus doloribus quidem. Quisquam
                        </p>
                    </div>
          </div> -->
      <div class="col-lg-4 col-md-6">
        <div class="card text-center p-4 mb-2 crd">
          <i class="fas fa-database fa-3x"></i>
          <h4>Datacenter Support</h4>
          <p class="p-2">
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam voluptatum, voluptate, quibusdam, quia voluptas quod quos exercitationem quae voluptatibus doloribus quidem. Quisquam
          </p>
        </div>
      </div>
      <!-- <div class="col-lg-4 col-md-6">
              <div class="card text-center p-4 mb-2">
                <i class="fas fa-sign-hanging fa-3x"></i>
                <h4>Digital Signage</h4>
                <p class="p-2">
                  Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam
                  voluptatum, voluptate, quibusdam, quia voluptas quod quos
                  exercitationem quae voluptatibus doloribus quidem. Quisquam
                </p>
              </div>
            </div> -->
      <div class="col-lg-4 col-md-6">
        <div class="card text-center p-4 mb-2 crd">
          <i class="fas fa-headset fa-3x"></i>
          <h4>General Support</h4>
          <p class="p-2">
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam voluptatum, voluptate, quibusdam, quia voluptas quod quos exercitationem quae voluptatibus doloribus quidem. Quisquam
          </p>
        </div>
      </div>
      <div class="col-lg-4 col-md-6">
        <div class="card text-center p-4 mb-2 crd">
          <i class="fas fa-server fa-3x"></i>
          <h4>Network Support</h4>
          <p class="p-2">
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam voluptatum, voluptate, quibusdam, quia voluptas quod quos exercitationem quae voluptatibus doloribus quidem. Quisquam
          </p>
        </div>
      </div>
      <div class="col-lg-4 col-md-6">
        <div class="card text-center p-4 mb-2 crd">
          <i class="fas fa-cash-register fa-3x"></i>
          <h4>POS Services</h4>
          <p class="p-2">
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam voluptatum, voluptate, quibusdam, quia voluptas quod quos exercitationem quae voluptatibus doloribus quidem. Quisquam
          </p>
        </div>
      </div>
      <div class="col-lg-4 col-md-6">
        <div class="card text-center p-4 mb-2 crd">
          <i class="fas fa-tower-cell fa-3x"></i>
          <h4>Telecom Services</h4>
          <p class="p-2">
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam voluptatum, voluptate, quibusdam, quia voluptas quod quos exercitationem quae voluptatibus doloribus quidem. Quisquam
          </p>
        </div>
      </div>
      <div class="col-lg-4 col-md-6">
        <div class="card text-center p-4 mb-2 crd">
          <i class="fa-solid fa-bars fa-3x"></i>
          <h4>Additional Services</h4>
          <p class="p-2">
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam voluptatum, voluptate, quibusdam, quia voluptas quod quos exercitationem quae voluptatibus doloribus quidem. Quisquam
          </p>
        </div>
      </div>
    </div>
  </div>
</section>
<!-- SERVICES SECTION CLOSE -->