CSS中有一個非常方便的屬性——object-fit，它可以讓我們將圖片按比例進行縮放，同時可以控制圖片在父元素中的位置和尺寸。

以一個例子來說明。假設我們有一個父元素容器，設置寬度為400px，高度為200px。我們在其中插入一張圖片，但是該圖片的寬高比例與容器不一致。為了讓圖片完整地顯示在容器中，并按比例縮放，我們可以添加如下CSS代碼：

img{
width: 100%;
height: 100%;
object-fit: contain;
}

上述代碼中，width和height都設為100%，表示讓圖片的寬高均鋪滿父元素容器。而object-fit: contain;屬性表示保持圖片的原始比例，同時縮放圖片以適應容器大小，且保留圖片的全部內容。如果我們將object-fit屬性設為cover，則圖片會進行剪裁，以填滿容器，但是圖片的內容不會被拉伸或歪斜。

如果我們要控制圖片在父元素中的位置，則可以使用object-position屬性。該屬性可以設置圖片相對于容器的位置，其值可以是像素、百分比，也可以是關鍵字。object-position: center center;表示將圖片居中顯示在容器中。

總之，object-fit和object-position這兩個CSS屬性可以讓我們輕松地進行圖片布局和排版，不僅能夠按比例縮放圖片，還能控制其在容器中的位置和尺寸。