HTML图片重新调整大小和居中

我已经读过很多文章试图重新调整我的图像大小，但它不起作用，有人能帮我把图像居中并缩小吗

HTML:

---

它没有居中，因为它的位置设置为固定<代码>边距：0自动不适用于固定位置元素。您必须将

左

设置为50%，然后将

空白处设置为负数

将其向后拉一半宽度。例如：

img {
    position:fixed;
    width:300px;
    left:50%;
    margin-left:-150px;
}

---

你的css指的是.image img，当它是图像的id时， 所以应该是#图像img

并且您要指定一个具有以下属性的： 可能最大宽度：80%

---

或宽度：400px

我认为您可以使用位置或边距，但如果您有许多大小不同的图像，则可能无法使用。 更好的方法是，我认为你应该使用背景图像。像这样：

Html

---

这可能是因为您正在HTML中使用id属性，并且正在CSS中设置类的样式？.mainBody->the'.'表示类，但您在HTML中使用它作为id而不是类。。您应该使用“#”代替id（例如#mainBody），这也适用于其他。

.mainBody{
    width: 100%;
    margin-right: auto;
    margin-left: auto;}
.image {
    width: 60%;
    position: fixed;
    align-items: center;}
.image img{
    position: fixed;
    display:block;
    margin-left: auto;
    margin-right: auto;
    vertical-align: middle;}
'

img {
    position:fixed;
    width:300px;
    left:50%;
    margin-left:-150px;
}

<div id="image">
</div>

#image {
    background-image: url(path/to/your/image);
    background-position: center;
    //set size of #image div like you want
}