Bước 1:Chúng ta phải tạo 1 thẻ div bao phủ ở ngoài.
Ví dụ:
<div class="thumb" style="background-image: url(http://webfaver.com/thumbnail.jpg);"></div>
Bước 2: Điều chỉnh CSS
.thumb{
/*position: relative;
display: block;*/
/*width: 200px;*/
height: 300px;
background-color: #3e3e3e;
background-image: none;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
Hãy chú ý vào phần style cho .thumb . Trọng yếu của kỹ thuật này chính là sử dụng hai thuộc tính background-size và background-position . Để làm cho ảnh nền tự resize vừa theo kích thước của thẻ div, ta dùng thuộc tính background-size với giá trị là cover . Sau đó dùng background-position với giá trị center để căn giữa ảnh vào khung nhìn của thumbnail.
