Rumah > Soal Jawab > teks badan
P粉3221067552023-08-17 00:57:17
Kod CSS ini menjadikan imej pada tetikus menutupi keseluruhan skrin sambil mengekalkan nisbah bidangnya. Imej akan dipangkas mengikut keperluan dan dilaraskan apabila tetingkap penyemak imbas diubah saiznya. Bekas menggunakan kedudukan tetap dan penjajaran lentur untuk paparan berpusat, manakala padanan objek: penutup memastikan pemangkasan.
/* 将此CSS应用于您的鼠标悬停图像 */ .hover-image { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; display: flex; align-items: center; justify-content: center; overflow: hidden; /* 当图像大于屏幕时,这将隐藏任何溢出部分 */ } .hover-image img { width: 100%; /* 使图像占据容器的整个宽度 */ height: auto; /* 保持宽高比 */ object-fit: cover; /* 裁剪图像以覆盖容器并保持宽高比 */ }
<img src="https://picsum.photos/200/300" class="hover-image">