似乎无法修复我的图像的 css答案

【问题标题】：Cant seem to fix the css of my image似乎无法修复我的图像的 css
【发布时间】：2013-10-29 20:57:58
【问题描述】：

d e l e t e 删除这个删除这个删除这个删除这个删除请

【问题讨论】：

position:right? border-image:10px?真的吗？
@PlantTheIdea 很有帮助。
你的背景图片中还有一个额外的 }
@kehrk 我认为你用那条评论从我这里偷走了有用的标题。关键是你不能只发明 CSS 属性值，你需要遵循指南。例如，这里是 position => developer.mozilla.org/en-US/docs/Web/CSS/position 的规则。
@PlantTheldea 我做了 10px 只是为了看看是否有明显的改变，请给我建议，我两天前开始这样做，所以我知道我很烂。

【解决方案1】：

您的 HTML 和 CSS 确实需要一些帮助。你的 CSS 中有一些未闭合的标签和一些额外的右括号。无论如何，您需要更改的部分是图像的 CSS。请注意更改后的选择器和 CSS。

.niomi img {
    display: block;
    margin: 0 auto;
}

这是一个有效的fiddle。我把 HTML 和 CSS 一起清理了一下。它可能仍然存在一些问题，但我希望它能帮助您入门。

【讨论】：

【解决方案2】：

你要找的 css 是这样的：

.niomi {
    display: block;
    width: 200px;
    margin: 0 auto;
}

div 没有得到任何 css 更改的原因是因为您在此行末尾有一个额外的大括号：

body { 
    background-image: url(http://cdn.elegantthemes.com/blog/wp-content/uploads/2013/09/bg-1-full.jpg); }
}

这会导致选择器随后出现问题。

【讨论】：

【解决方案3】：

您可能想了解页边距，特别是“自动”对元素的作用。

【讨论】：

【解决方案4】：

您的样式没有流行的主要原因是因为您在 body 的 CSS 中有一个额外的 }。它会导致浏览器忽略 .niomi 类中的所有内容。

变化：

body 
{ 
    background-image: url(http://cdn.elegantthemes.com/blog/wp-content/uploads/2013/09/bg-1-full.jpg); }
}

到：

body 
{ 
    background-image: url(http://cdn.elegantthemes.com/blog/wp-content/uploads/2013/09/bg-1-full.jpg);
}

然后将您的 CSS 更改为：

.niomi {
  text-align: center;
}

这应该可以解决它。

最后一个需要修复的无关问题：

将</body> 标记下移到最后一个</html> 标记上方的一行。

【讨论】：

【解决方案5】：

您可以在图像周围的 DIV 上使用 text-align property。比如：

.niomi {
    text-align: center;
}

这将使包含在 DIV 中的图像以及 DIV 中的其他任何内容居中对齐。这确实取决于周围的 DIV 是否为 100% 宽以实现您想要的效果 - 如果您稍后移动 DIV 并使其嵌套，您最终可能会导致图像偏离中心。

更好的方法是使用边距属性as found in this example。

【讨论】：