CSS中的圖片Mode指的是背景圖片的填充方式。通常我們會用background-size屬性來設(shè)置背景圖片的尺寸,而 Mode則可以用來設(shè)置背景圖片的填充方式。
background-size: cover;
cover表示圖片會以包裹容器的方式顯示,不會留下任何空白。如果容器的寬高比與圖片的寬高比不一致時,圖片會被裁剪掉。
background-size: contain;
contain表示圖片會以完整的方式顯示,但是會留下一些空白,以保持圖片的完整性。這樣的話,不論容器的寬高比與圖片的寬高比是否一致,都能夠完整地顯示圖片。
background-size: 100% 100%;
100% 100%這樣的設(shè)置表示讓圖片填滿整個容器,但是會按照圖片的原始比例進行拉伸和縮放。
background-size: auto;
auto則表示讓圖片以原始大小進行填充,不進行縮放和拉伸。
通過在CSS中設(shè)置Mode屬性,我們可以更加靈活地控制背景圖片的顯示方式,以便更好地適應(yīng)不同的設(shè)備和應(yīng)用場景。