app css图片居中

在app开发中，经常需要让图片居中显示。这里介绍一些css技巧，帮助开发者实现图片的居中。 首先，我们先考虑最简单的情况：一张图片需要在div中居中显示。 这时，可以使用以下css代码：

div{
  display:flex;
  justify-content:center;
  align-items:center;
}
img{
  max-width:100%;
  max-height:100%;
}

这样，div中的图片就可以水平垂直居中显示。其中，display:flex;是使得div可以变为弹性布局，justify-content:center;是使得子元素水平居中，align-items:center;是使得子元素垂直居中。 另外，使用max-width:100%;和max-height:100%;可以使得图片在超出div边界时自动缩小以适应尺寸。 如果要将图片居中到整个页面中，而不是容器中，可以使用以下css代码：

html,body{
  height:100%;
}
body{
  display:flex;
  justify-content:center;
  align-items:center;
}
img{
  max-width:100%;
  max-height:100%;
}

这样，整个页面中的图片就会水平垂直居中显示。 以上是几种常见的图片居中技巧，可以根据实际需求选择使用。