把图片设为父级元素的背景图片是最简单的方法：
<div style="width:400px height:300px background:url(123.jpg) no-repeat center / cover"></div>如果一定要以单独的图片展示，则这样：
<div style="position:relative width:400px height:300px overflow:hidden"><img src="123.jpg" style="position:absolute left:50% top:50% transform:translate(-50%,-50%) min-width:100% min-height:100% " />
</div>
<!--以上适用于图片的长和宽至少有一个是小于div外框的情况-->
<!--如果图片的长和宽都大于div外框，则必须结合js才行-->
<div style="position:relative width:400px height:300px overflow:hidden">
<img src="123.jpg" style="position:absolute left:50% top:50% min-width:100% min-height:100% transform:translate(-50%,-50%)" onload="if(this.width>400&&this.height>300){if(this.width/this.height<400/300){this.style.maxWidth='100%'}else{this.style.maxHeight='100%'}}" />
</div>
样式部分<style type="text/css">
.bs a {display:blockwidth:222pxmargin:0 auto}
.bs a { border:1px solid #DDD}
.bs a:hover { border:1px solid #000}
</style>
代码部分
<div class="bs">
<a href="#"><img src="000.jpg" border="0" /></a>
</div>
边框不用图片也可以 呵呵
想上下居中的话
在样式部分的 bs类中 添加 padding:XXpx 0px
XX写需要的内边距..假如图片高度20px的话 padding:10px 0px
那么实际高度是40px 上下 有10px的 空白..图片在中间...
后面的 0px 不写px也行...那是左右的内边距...在这里 左右就没意义了
因为 margin:0 auto 是 居中....
css插入图片方法如下：
操作设备：戴尔笔记本电脑
操作系统：win10
操作程序：html编辑器v8.21
1、打开html编辑器并创建一个新的html文件。
2、新建完一个新的html文件后，在index.html的<style>标签中，输入如下所示的CSS代码。
3、输入完CSS代码之后，接下来运行index.html页面，可以发现，本地图片通过背景图片衜中的本地路径成功调用为了背景图片，图片就成功加入了。
