Saya sedang membuat tapak web menggunakan Bootstrap 5 tetapi sifat index.css tidak digunakan pada index.html. Apabila saya menuding pada kad perkhidmatan, latar belakang harus berubah, memberikan kesan peralihan. Sepatutnya dari ini ke ini. Walau bagaimanapun, saya fikir mungkin terdapat masalah dengan CSS yang dipautkan ke HTML, kerana apabila saya cuba menukar latar belakang tapak kepada warna rawak, perubahan itu tidak muncul di tapak.
@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 href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<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 -->
1 jawapan
Saya membuat kesilapan semasa memautkan CSS ke HTML, saya membetulkannya. Terima kasih atas bantuan semua orang walaupun.
<link rel="stylesheet" href="./index.css" />
Alat panas Tag
Hot Questions
Hot Tools
vc9-vc14 (32+64 bit) koleksi perpustakaan masa jalan (pautan di bawah)
Muat turun koleksi perpustakaan runtime yang diperlukan untuk pemasangan phpStudy
VC9 32-bit
VC9 32-bit phpstudy pustaka masa jalan persekitaran pemasangan bersepadu
Kotak alat pengaturcara PHP versi penuh
Programmer Toolbox v1.0 PHP Persekitaran Bersepadu
VC11 32-bit
VC11 32-bit phpstudy pustaka masa jalan persekitaran pemasangan bersepadu
SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan
Topik panas





