html - 在 HTML5 中，如何按照需要的方式对齐标题

Question

我目前正在练习一些 HTML 5 Web 应用程序开发，但我什至无法让我的标题正确对齐。

访问http://www.sithhappens.net看我的意思，（查看页面源代码看我的 html）和http://www.sithhappens.net/iphone.css 看 CSS

我希望“Route.me”对齐中间，并且按钮（在我在那里实现按钮之前只是一个占位符）保持在左侧。谢谢。

（在您的移动设备上访问网页）

Answer 1

这是正确的 HTML，我已将样式注入 HTML，因此您可以看到它是如何完成的。诀窍是使按钮位置：绝对，因此它不会影响文本“Route.Me”的间距。

<article>
<header><button style="
    position: absolute;
">Button</button> <div align="center" style="display: block; text-align: center;">Route.Me </div>
</header>
</article>

Answer 2

仅使用

<div align="center" style="margin-top:-20px;">Route Me</div>

Answer 3

您必须在元素中放置button文本。<p>像这样设置样式：

<div class="btn">Button</div>
<div align="center" class="txt" >Route.Me </div>

CSS

.btn {
    float:left;
}

.txt {
    display:block;
}