CSS 圖片對其方式指的是如何將圖片與內容一起呈現,并使其適應不同的屏幕尺寸和設備。下面將介紹幾種常見的 CSS 圖片對其方式。
/* 居中對齊 */ img { display: block; margin: 0 auto; } /* 左對齊 */ img { float: left; margin: 0 10px 10px 0; } /* 右對齊 */ img { float: right; margin: 0 0 10px 10px; } /* 橫向居中 */ div { text-align: center; } img { display: inline-block; } /* 等比例縮放, 寬度不超過容器寬度 */ img { max-width: 100%; height: auto; } /* 背景圖片,鋪滿容器 */ div { background: url("image.jpg") no-repeat center center fixed; background-size: cover; }
以上是幾種常見的 CSS 圖片對其方式。需要注意的是,圖片的尺寸和質量也會影響呈現效果,因此在使用圖片時應該根據實際需求進行編輯和壓縮。