Html 在css中将照片居中对齐有问题

我是一个新的HTML和学习的语言，但当我试图创建这个网站的顶部照片不会在中心对齐。我尝试过垂直对齐和填充，但运气不佳。把我的代码放在下面。谢谢回复

.hudson{
颜色：白色；
位置：相对位置；
字体大小：60px；
顶部：105px；
字体系列：Futura，'Trebuchet MS'，Arial，无衬线；
文本对齐：居中；
}
.三{
文本阴影：0 1PX0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 3PX0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 B9B9，0 5PX0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 3）bbb B B B，0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0),；
}
.p1{
位置：相对位置；
文本对齐：居中；
顶部：70像素；
文本对齐：居中；
-webkit动画延迟：1s；
}
.p2{
位置：相对位置；
文本对齐：居中；
顶部：80px；
文本对齐：居中；
-webkit动画延迟：1s；
}
.p3{
位置：相对位置；
文本对齐：居中；
顶部：90px；
文本对齐：居中；
-webkit动画延迟：1s；
}
.编码{
对齐项目：居中；
填充：10px；
}
paracolor先生{
颜色：天蓝色；
字体大小：25px；
字体系列：Orbitron；
文本对齐：居中；
}
#图标{
填充顶部：100px；
文本对齐：居中；
}
#图标一{
颜色：白色；
}
身体{
背景图像：url（图片1/mountains4.jpeg）；
背景重复：无重复；
}

哈德逊铰刀
诸如此类
诸如此类
诸如此类

您可以使用左右边距值

auto

，对独立元素进行居中。由于图像是一个内联元素，因此还必须使用

display:block以使其正常工作。元素需要一个宽度：


.hudson{
颜色：白色；
位置：相对位置；
字体大小：60px；
顶部：105px；
字体系列：Futura，'Trebuchet MS'，Arial，无衬线；
文本对齐：居中；
}
.三{
文本阴影：0 1PX0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 3PX0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 B9B9，0 5PX0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 3）bbb B B B，0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0),；
}
.p1{
位置：相对位置；
文本对齐：居中；
顶部：70像素；
文本对齐：居中；
-webkit动画延迟：1s；
}
.p2{
位置：相对位置；
文本对齐：居中；
顶部：80px；
文本对齐：居中；
-webkit动画延迟：1s；
}
.p3{
位置：相对位置；
文本对齐：居中；
顶部：90px；
文本对齐：居中；
-webkit动画延迟：1s；
}
.编码{
显示：块；
左边距：自动；
右边距：自动；
最大宽度：125px；
最大高度：125px；
填充：10px；
}
paracolor先生{
颜色：天蓝色；
字体大小：25px；
字体系列：Orbitron；
文本对齐：居中；
}
#图标{
填充顶部：100px；
文本对齐：居中；
}
#图标一{
颜色：白色；
}
身体{
背景图像：url（图片1/mountains4.jpeg）；
背景重复：无重复；
}

哈德逊铰刀
诸如此类
诸如此类
诸如此类
作为一名初级开发人员，您的搜索似乎不够。如果你想用谷歌搜索，有很多方法可以做到这一点

加上

填充：047%

以您的img标签样式

<img class="coding animated fadeInDown" src="PICTURES1/coding.png" style="padding: 0 0 0 47%; max-width:125px;max-height:125px;">


对齐项目
用于Flexbox项目；看，我试过了，但没用。谢谢你的评论！很抱歉没有把这个问题提出来。谢谢你的评论和反馈！帮助了我。