Css 是否可以使图像居中？

是否可以使图像居中？因此，它将像背景位置一样显示：居中

HTML:

<div class="image-container">
    <img src="{img_src}" />  //Lets assume original dimension of image is 1200X700
 </div>

我希望图像填充整个容器宽度，并删除图像的左侧和右侧部分，使其显示为居中。

您可以将文本对齐：居中指定给img的父级

或

使用边距：0自动到img

.一{ 文本对齐：居中； 显示：块； } .两个img{ 保证金：0自动； 浮动：无； 显示：块； }

---

您不必在img上设置任何样式

而是使用display:flex设置容器的样式，并将其中的项目垂直和水平对齐，以便实现您想要的

在下面的示例中，我将相同的图像放在两个不同的容器中，第一个是样式化的，第二个不是为了显示差异

记住。在这个例子中。图像不会缩小或调整大小，而是具有相同的宽度和高度1200x700，但不适合容器内部的部分会被剪切

如果有帮助，请告诉我

.图像容器{ 宽度：500px； 高度：400px； 显示器：flex； 对齐项目：居中； 证明内容：中心； 溢出：隐藏 }

---

.image容器img{最大宽度：60%；边距：自动；}或

---

.image container img{max width:300px；margin:auto；}

可能，但您想要什么？这个问题完全模糊，无法回答。什么形象？在什么情况下？使用哪种标记？哪些风格规则？请更具体地说明你想要达到的目标。分享相关代码，并制作一个工作示例，向我们展示您的问题。我在使用img标记将图像居中时遇到问题，我希望图像根据窗口宽度剪切左右部分。我知道可以使用背景img使图像居中，在css中定位，但我使用img标记使图像居中有困难请分享您的尝试，制作代码片段，添加HTML/css，我们需要上下文

.image-container {width:500px; height:400px}
.image-container img { max-width:100%; }