Html标题和链接在同一行

时间:2012-04-10 06:29:43

标签: html css

我是css的新手。我想在中心显示标题h2,在同一行显示右端的链接。

我尝试了几个选项,但所有选项都将标题对齐到左侧。 任何帮助表示赞赏。

感谢。

2 个答案:

答案 0 :(得分:9)

有几种方法可以做到这一点。我能想到的最简单,最快捷的方法是使用父div并将标题和链接放在其中。所以你的HTML看起来像这样:

<div class="test">
    <h2>Heading comes here</h2><a href="">Link comes here</a>
</div>

您的风格如下:

.test {
    text-align: center;
}
h2 {
    display: inline-block;
}

a {
    float: right;
}

答案 1 :(得分:2)

像这样写:

<强> HTML

<h1>heading <a href="#">link</a></h1>

<强> CSS

h1{
    text-align:center;
}
h1 a{
    float:right;
}

选中此http://jsfiddle.net/KJSmB/