css - 似乎无法修复我的图像的 css

Question

删除删除这个删除这个删除这个删除这个请删除

score 1 · Accepted Answer

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

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

这是一个工作小提琴。我把 HTML 和 CSS 一起清理了一下。它可能仍然存在一些问题，但我希望它能让你开始。

score 1 · Accepted Answer

你正在寻找的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); }
}

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

score 0 · Accepted Answer

您可能想对页边距进行一些阅读，特别是关于“自动”对元素的作用。

score 0 · Accepted Answer

您的样式没有流行的主要原因是您}的 CSS 中有一个额外的body. 它会导致浏览器忽略您.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>。

score 0 · Accepted Answer

您可以在图像周围的 DIV 上使用text-align 属性。就像是：

.niomi {
    text-align: center;
}

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

更好的方法是使用 margin 属性，如本例所示。

5 回答 5