HTML讓背景圖片不受自適應影響的方法

要讓背景圖片不受自適應影響，可以使用CSS的background-size屬性來控制背景圖的大小，同時也可以使用background-position屬性來控制背景圖在元素中的位置。

一、使用background-size

background-size屬性可以指定背景圖片的尺寸，可以是像素值、百分比，也可以是cover和contain，分別表示將背景圖片縮放至完全覆蓋元素和完全包含元素，不超過元素的寬高。

background-size: cover; /* 背景圖片等比縮放，盡量讓圖片覆蓋元素 */
background-size: contain; /* 背景圖片等比縮放，盡量讓圖片包含在元素內 */
background-size: 100% 100%; /* 背景圖片拉伸，使得寬和高全部填滿元素 */

例如，以下代碼將背景圖片等比縮放並覆蓋整個元素：

div{
  background-image: url('背景圖片地址');
  background-size: cover;
}

二、使用background-position

background-position屬性可以指定背景圖片在元素中的位置，可以是像素值、百分比，也可以是left、center、right、top、bottom等值，分別表示左對齊、居中對齊、右對齊、上對齊、下對齊。

background-position: 50% 50%; /* 背景圖片在元素中心 */
background-position: left top; /* 背景圖片在元素左上角 */
background-position: 0 0; /* 背景圖片在元素左上角 */

例如，以下代碼將背景圖片放置在元素中心：

div{
  background-image: url('背景圖片地址');
  background-size: cover;
  background-position: 50% 50%;
}

三、結合background-size和background-position

可以通過結合使用background-size和background-position屬性來控制背景圖片在元素中的大小和位置。

div{
  background-image: url('背景圖片地址');
  background-size: cover;
  background-position: center center;
}

四、背景圖片不跟隨滾動

如果需要讓背景圖片固定，不隨頁面的滾動而滾動，可以使用background-attachment: fixed屬性。

div{
  background-image: url('背景圖片地址');
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
}