html - 如何让这些图像在页面上居中?

标签 html css image centering

我正在制作一个正在 build 中的页面,其中包含一张背景图片和两张我在 Photoshop 中制作的图片。他们说的是“我们正在 build 中”和“Quinncuatro Productions 的产品”之类的话。现在一切都完美地显示在页面上,但图像似乎真的很喜欢紧靠在页面的左侧。这就是我现在所拥有的。我最简单的想法现在就在样式标签中。我的第一个和第二个想法在标题评论中。我做错了什么吗?

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Think Klinck</title>
<style>
body{
background-image:url('metalBackground.jpg');
}
img{
margin-left:auto;
margin-top:auto;
}

/*This was the first idea that I had:
.UnderConstruction{
align:center;
margin-left:auto;
margin-top:auto;
}
.Q4Productions{
align:center;
margin-left:auto;
margin-top:auto;

And this was my second:
div.center{
margin-left:auto;
margin-top:auto;
}
*/
</style>
</head>

<body>

<div id="UnderConstruction" class="center">
<img src="UnderConstruction.gif" alt="ThinKlinch.com is regretfully under construction.">
</div>

<div id="Q4Productions" class="center">
<img src="Q4Productions.gif" alt="A product of Quinncuatro Productions.">
</div>

</body>
</html>

最佳答案

#UnderConstruction,#Q4Productions{
    text-align:center;
}​

或者

.center{
    text-align:center;
}​

这将使您的图像在 div 中居中。

关于html - 如何让这些图像在页面上居中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12876954/

相关文章:

javascript - jQuery 将固定或绝对定位的元素向左或向右移动

html - 用于二进制数据传输和解码的 websocket

javascript - 文本字段的背景颜色 :focus

javascript - Bing map V8 图钉不透明度

python - 如何对绿地/草地中的白线进行图像分割

javascript - 将图像数据设置到输入文件标签中

html - 全屏居中背景继续居中,即使我得到滚动条

javascript - 在输入 jquery 中删除值时清除所有更改

javascript - CSS - 过渡在 JavaScript for 循环中无法正常工作

java - BufferedImage setRGB 奇怪的结果