【问题标题】:How do I get these images centered on the page?如何使这些图像居中在页面上?
【发布时间】:2012-10-14 05:02:11
【问题描述】:

我正在制作一个正在建设的页面,其中包含一张背景图片和两张我在 Photoshop 中制作的图片。他们说的是“我们正在建设中”和“Quinncuatro Productions 的产品”。现在一切都完美地显示在页面上,但图像看起来真的很喜欢拥抱页面的左侧。这就是我现在所拥有的。我最简单的想法是现在的样式标签。我的第一个和第二个想法在标题 cmets 中。我是不是做错了什么?

<!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>

【问题讨论】:

    标签: html css image centering


    【解决方案1】:
    #UnderConstruction,#Q4Productions{
        text-align:center;
    }​
    

    或者

    .center{
        text-align:center;
    }​
    

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

    【讨论】:

    • 啊啊啊我觉得自己很笨。非常感谢,陌生人。如果允许,我会在 11 分钟内发布您已接受的答案。
    猜你喜欢
    • 2019-07-20
    • 1970-01-01
    • 2018-12-08
    • 2014-06-29
    • 2018-02-05
    • 1970-01-01
    • 2013-05-06
    • 2013-06-26
    • 2017-09-29
    相关资源
    最近更新 更多