Question

如何将div中的img和h1居中？现在我在标题中有一个png和一个h1，但内容自动在左上角。如何将其置于中间并保持响应？这是我的HTML：

   <header>
       <h1 id="title">Lorem Ipsum</h1>

       <img id="arrows" src="images/arrows.png">
       <h3 id="sub-title">Lorem ipsum</h3>
   </header>

Answer 1

您只需将text-align: center添加到父元素即可。它也很敏感。

＆＃13;

header {
  text-align: center;
}

＆＃13;

<header>
  <h1 id="title">Lorem Ipsum</h1>
  <img id="arrows" src="http://placehold.it/100x100" />
  <h3 id="sub-title">Lorem ipsum</h3>
</header>

＆＃13;

Answer 2

您可以将h1和img包装在div中。从div你可以做保证金：0自动;这将以h1和img

为中心

div{ margin: 0 auto; text-align: center; }

Answer 3

这是你想要的：http://jsfiddle.net/sjmcpherso/3ystho4v/

header{text-align:center;position:relative}
header h3{position:absolute;left:0;top:0;}

Answer 4

使用css

header {
  text-align: center;
}

将标题元素内容居中

4 个答案: