使标题中心对齐 [英] Make heading center align

问题描述

如何在以下代码中居中< h3> ？

  h1 {color：＃666; margin：20px 10px 0px; padding：0px 30px 0px 30px; text-align：center;} h3 {color：#ccc;背景颜色：黑色; margin：0px; padding：10px 10px 10px 10px; text-align：center; display：inline-block;}  

< div> < h1> title 1< / h1> < h3> title 3< / h3>< / div>

p> FIDDLE

解决方案

您应该为< div> 和样式< div> 添加一个类。

目前，您的< div> 就像父母一样。设置 text-align：center 。

例子：

<

  h1 {color：＃666; margin：20px 10px 0px; padding：0px 30px 0px 30px;} h3 {color：#ccc;背景颜色：黑色; margin：0px; padding：10px 10px 10px 10px; display：inline-block;}。center {text-align：center;}  

 < div class =center> < h1> title 1< / h1> < h3> title 3< / h3> < / DIV>  

How to center <h3> in the following code?

h1 {
  color: #666;
  margin: 20px 10px 0px;
  padding: 0px 30px 0px 30px;
  text-align: center;
}

h3 {
  color: #ccc;
  background-color: black;
  margin: 0px;
  padding: 10px 10px 10px 10px;
  text-align: center;
  display: inline-block;
}

<div>
    <h1>title 1</h1>
    <h3>title 3</h3>
</div>

FIDDLE

解决方案

You should add a class to <div> and style <div>.

Currently, you <div> like parent. Set text-align: center.

Example:

h1{
  color: #666;
  margin: 20px 10px 0px;
  padding: 0px 30px 0px 30px;
}

 h3 {
  color: #ccc;
  background-color: black;
  margin: 0px;
  padding: 10px 10px 10px 10px;
  display: inline-block;
}

.center {
  text-align: center;
}

<div class="center">
        <h1>title 1</h1>
        <h3>title 3</h3>
 </div>
 

这篇关于使标题中心对齐的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！