Question

我有两个标题，我想在同一行显示，但一个在左边，一个在右边。这样做的最佳方式是什么？

HTML：

<h2 style="color: green" style="text-align : center">Approved</h2><h4>Count: </h4>

CSS：

h2 {
    font-size: 11.5pt;
    font-family: Georgia;
    display: inline;
}
h1 {
    margin: 0.5em 0 0.5em 0;
    padding: 0.5em 0 0.5em 10px;
    font-size: 12pt;
    font-family: Georgia;
    color: white;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    display: inline;
}

Answer 1

您可以为每个标头添加float属性，如：

h2 { float: left; }

和

h1 { float: right }

Answer 2

你可以使用float。

h2 {
    font-size: 11.5pt;
    font-family: Georgia;
    display: inline;
    float:right;
}
h1 {
    margin: 0.5em 0 0.5em 0;
    padding: 0.5em 0 0.5em 10px;
    font-size: 12pt;
    font-family: Georgia;
    color: white;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    display: inline;
    float:left;
}

Answer 3

试试这个

demo

<div class="first"><h1 style="color: green" style="text-align : center">Approved</h1><h2>Count: </h2></div>

CSS标题在同一行上对齐

3 个答案: