在網頁設計中，圖片是重要的元素之一。而長寬比則是圖片的重要屬性之一。在CSS中設置圖片的長寬比可以讓圖片按照指定的比例進行展示。

img{
width: 200px;
height: 100px;
aspect-ratio: 2/1;
}

在上面的代碼中，我們設置了圖片的寬度為200px，高度為100px，同時使用了aspect-ratio屬性來指定了長寬比為2:1。這樣，無論圖像如何縮放，寬高比都將始終遵守2:1。

除了使用aspect-ratio屬性外，還可以使用padding和background屬性來實現圖片的比例展示。下面的代碼展示了如何使用padding和background屬性來實現圖片比例展示。

.image{
width: 200px;
padding-top: 75%; 
/*設置頂部內邊距為75%來確定圖片高度*/
background-size: cover;
background-image: url("image.jpg");
}

在上面的代碼中，我們設置了一個class為image的元素。然后，我們將設置元素的寬度為200px，并且設置了頂部內邊距為75%。這樣，圖片高度就能夠按照比例展示。接著，我們使用了background-image屬性來指定圖片的路徑，使用background-size屬性來保證圖片能夠填充整個元素。

總的來說，設置圖片的長寬比是網頁設計中非常重要的一項技能。無論是使用aspect-ratio屬性、padding和background屬性還是其他的方法，我們都可以輕松地實現圖片比例的展示。