无处安放的居中（未解决）

面试时总问到几种方式实现居中，当时觉得很奇怪，为什么需要了解那么多方式实现一个效果，
等到真正做需求才发现，根据不同的场景可能有不同的限制，只掌握一种方式是不能实现各种情况下的居中需求。

需求：让后端返回的富文本中div的img居中

两种方式（都存在问题）：

一、div设置为text-align: center; width: 100%，img自然居中。
问题：如果div中还有文字等内容，也会变成居中，也就是word中段落居中的效果，是不想要的副产品。

二、img设置为display: block，然后设置margin: 0 auto。
问题：如果是渲染完的页面使用js操作dom，由于document的高度已经固定了，div的高度会变化，导致手机端滑不到底（会有遮挡），WHY？？