html中怎么固定一张图片大小,固定大小的div，不固定大小的图片如何放入div?

1 . css代码

.imgBox{

background-image: url(./shengdan.png); //图片路径 可写在标签的style当中

background-repeat: no-repeat;

width: 120px;

height: 120px;

overflow: hidden;

background-position: left top;

border: 1px solid #000;

}

2 . HTML代码部分

解释：

1  .这段代码中 div 限制了图片显示区域的大小，当图片过大的隐藏，过小时显示在左上角 。这里要注意的       是不可设置background-size的值 ，如果设置了，就会改变图片的大小。

2 . 此代码中background-position:left top ; 表示图片的最左位置显示在左( left ) ,最顶部显示在上( top )

效果：

------------------------------------------------------------------------------

background-position:right bottom ; 表示图片的最右位置显示在右( right ) ,最底部部显示在上( bottom )

效果：

------------------------------------------------------------------------------

总结：

1 . background-position 这个属性值(left top right bottom)可以理解为绝对定位中的(left top right  bottom)

应用：

1 .  此方法可以用在商城的商品显示中使用到，解决 应对商家上传图片时，不固定的图片大小的显示。