對齊和縮放圖像

Question

我需要W3Schools網站上的此程式碼幫助，我想將所有元素保留在頁面中央。然而，當我居中時，該功能的鏡頭針對影像的舊位置。 https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_image_zoom改變了程式碼，但看不懂當影像居中時，鏡頭位於影像之外。就像這是她以前的職位一樣圖像中心，鏡頭位置不正確已解決!!!為了解決這種情況，創建了一

P粉237029457 · Answer

那麼，據我了解，您希望圖像和縮放結果保持原樣，但在頁面中居中？

如果是這樣，您需要在 css 中使用 flexbox，如下所示：

.img-zoom-container {
  position: relative;
  flex-direction: column;
  display: flex;
  align-items: center;
}