CSS 이미지 object-fit cover

CSS 이미지 비율유지, 최대크기로 cover

CSS 이미지 비율유지, 최대크기로 crop

CSS background-size

cover

1 예시

<style>
div {
    width: 100px; height: 100px;
    margin: 10px;
    background: url('https://upload.wikimedia.org/wikipedia/commons/thumb/5/50/Albert_Einstein_%28Nobel%29.png/260px-Albert_Einstein_%28Nobel%29.png') no-repeat;
}
.box1 {
    background-size: contain;
}
.box2 {
    background-size: cover;
}
</style>

<div class='box0'></div>
<div class='box1'></div>
<div class='box2'></div>

2 같이 보기

• CSS 이미지 크기 비율에 맞게 줄이기
• CSS background-size 속성