给予你的链接一个“inline-block”的显示，它们会彼此相邻出现。然后你可以添加一些填充或边距给它们一些空间。
通过使用li标记并赋予它们display：inline-block样式，可以获得相同的结果。

<ul>
    <li style="display:inline-block;">
        <a href="index.html" style="text-decoration:none; color:#00FFFF;"><h1>Home</h1></a>
    </li>
    <li style="display:inline-block;">
        <a href="staff.html" style="text-decoration:none; color:#00FFFF;"><h1>Staff</h1></a>
    </li>
</ul>

顺便说一下，你不应该在同一个页面中使用两个或更多的“h1”标题，你应该避免使用内联样式。把它们保存在一个外部CSS文件中。
下面是使用display：inline-block样式并带有一定间距的原始代码：

<a href="index.html" style="display:inline-block; text-decoration:none; color:#00FFFF; margin-right:20px;"><h1>Home</h1></a>
<a href="staff.html" style="display:inline-block; text-decoration:none; color:#00FFFF;"><h1>Staff</h1></a>

根据thisballer 资源，<span>标记用于对文档中的内联元素进行分组：http://www.w3schools.com/tags/tag_span.asp

<span>
<a href="index.html" style="text-decoration : none; color : #00FFFF;">
<h1>Home</h1>
</a>
<a href="staff.html" style="text-decoration : none; color : #00FFFF;">
<h1>Staff</h1>
</a>
</span>