Question

我希望将图像放置在屏幕中间，可能在屏幕的左侧或右侧，但是我正在寻求有关如何将图像放置在我所感觉的位置的帮助，如果您愿意，请更正我的html / css相信我太难了/不正确-预先感谢-英里

编辑：对于那些想知道此页面是什么的人来说，这是一个带有背景图像的入口页面，另一个图像上写着“在此输入”，该图像超链接到我的实际网站的索引。

<html>

<head>
<title>Enter</title>
<link rel="stylesheet" href="style1.css">
</head>

<body background="index1background.jpg">

<div id="enterhere">
<p><a href="index2.html" title="Enter Here"><img src="index1enter.png"
    alt="Enter Here"</a></p> 
</div>

</body>

</html>

css：

#enterhere {
position: middle;
}

Answer 1

使用case的text-align属性将图像放置在所需位置

Answer 2

img {
margin-left: auto;
margin-right: auto;
display: block;
}

然后，您可以添加padding以便左右调整。 text-align: center在这种情况下不起作用。

编辑：如果您想更短一些，请使用较短的版本。

margin: 100px auto 0 auto;

此代码段包含margin-top中的100px。运作方式如下。代替使用关键字margin-top，margin-right等，我们使用主要关键字margin。然后的位置：

margin: [top] [right] [bottom] [left];

这也适用于padding。

Answer 3

如果您选择将图像放置在CSS中，请查看属性“ background-size”和“ Background-position”。

我希望您将图像放入img标签中，并在上方的容器中指定位置。有两种处理方法。 Flexbox和CSS网格（有关详细信息，请访问w3网站）。使用这些方法之一定位后，您可以使用将在图像的CSS中设置的属性“ margin”来调整图像的位置。

请确保有放置图像的原因-css或html。放置在html中的图像应与内容相关（例如产品图片）。 CSS放置的图像对于内容来说应该是不必要的（例如装饰图像）。

html / css定位图像

3 个答案: