Image+Unknownwidthandheight+Verticalcentering第一种：table-cell/inline-block+vertical-align条件：容器的宽高受图片默认宽高影响HTML结构：
CSS代码：div{显示：内联块；/*显示：表格单元格；*/填充：10px；边框：2px实心#aaa；}img{垂直对齐：中间；}要点：display:inline-block：使容器（即
）的宽高随图片大小变化vertical-align：middle：使图片在容器内垂直居中inline-block和table-cell都是有用的，区别在于前者中容器的大小与容器中图片的大小有关，后者中容器的长度与容器中图片的长度有关，而容器的高度与该行所有容器中图片的最大高度有关。第二种：“隐藏对象”+vertical-align条件：容器的宽高已知且大于图片的默认宽高。HTML结构：
CSS代码：.container{width:800像素;高度：600px；边框：2px实心#ddd；文本对齐：居中；}img{垂直对齐：中间；}.hidden{高度：100%；宽度：0；垂直对齐：中间；显示：内联块；.container)到容器底部,hiddenwithwidth:0
![]()
的vertical-align:middle和.hidden的vertical-align:middle规定
![]()
元素和.hidden元素必须对齐根据双方的中间。类型：transparent.gif+background-image:url('./picture.jpg')条件：容器宽高已知，图片宽高确定'transparent.gif'：透明gif格式图像;'background-image'：要显示的图片；html结构：
css代码：li{list-style:none;宽度：256px；高度：256px；填充：20px；边框：2px实心#ddd；}img{宽度：100%；高度：100%；显示：块；背景位置：中心；背景图片：url('./image.jpg');背景大小：100%；背景重复：不重复；}关键点：transparent.gif:透明，使背景图片成为显示图片background-position:center:使背景图片在容器中垂直居中（即
![]()
）
