Html 如何将此图像定位在页面的底部中心？

当我在浏览器上缩小到67%时，图像将显示在页面底部，就像我希望在页面正常时未缩小时显示的那样（）

但是图像在我的页面上显示为普通视图

这是我的CSS

.fix {
   position: relative;
   left: 30%;
   bottom: 10%;
}

---

鉴于文本是黑色的，图像也有黑色内容，请尽量将其作为

img

元素，而不是背景图像

---

您可以尝试将

填充底部

添加到

img

的父元素，该元素等于图像的

高度。
若要在页面中居中放置元素，应使用以下CSS：

.element {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

它还适用于
position:absolute
和
position:fixed
属性

left:50%
属性将使
.element
的左侧居中于页面的水平中心

transform:translateX（-50%）
属性将
.element
50%的宽度向左平移（因为是负值）

通过这种方式，
.element
将始终处于水平居中位置，无论其宽度如何

在图像上显示的下一个问题是，它与文本重叠。
为了避免这种情况，应该将此元素放在文本后面

以下是一个例子：


.fix{
位置：绝对位置；
底部：0；
左：50%；
-webkit转换：translateX（-50%）；
-moz变换：translateX（-50%）；
-ms转换：translateX（-50%）；
转化：translateX（-50%）；
}
身体{
位置：相对位置；
填充底部：100px；/*图像高度*/
}
Lorem ipsum door sit amet，一位杰出的领导者，他在劳动和生活中的时间是有限的。但是，在最低限度上，我们需要一个实验室来进行日常工作。两人或两人在一个无教区的房间里互相指责。除偶尔因疏忽而死亡外，不得因疏忽而导致动物死亡

知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。两人或两人在一个无教区的房间里互相指责。除偶尔因疏忽而死亡外，不得因疏忽而导致动物死亡

尝试
底部：0。左：0右：0边距：0自动
。另外，你的图像应该与你的身体相关。你能发布你的html代码吗？你想在滚动后显示图片还是必须进行修复？我想尝试看看这两者是否可行，我会选择最好的一个