Css 如何使用响应式布局调整页面标题的大小？

所以我有一个网站，我需要在移动设备和计算机上都能正常工作。我使用的是bootstrap responsive，有很多东西要做。目前我正在为头版的英雄单元工作。我有一个页眉，我想根据屏幕大小自动缩放。主引导站点(http://twitter.github.com/bootstrap/)使用类似于我想对其主页头执行的操作。感谢您的帮助

相关代码：

<div class="container">
        <div class="hero-unit">
            <div class="page-header">
                <h1>Page Header</h1>
            </div>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris arcu dolor, dictum scelerisque gravida nec, vulputate in odio. Pellentesque sagittis ipsum et mauris elementum vitae molestie ipsum blandit. Mauris tempus hendrerit arcu, sed vestibulum justo tempor a. Praesent sit amet odio ligula. Morbi sit amet leo vestibulum neque bibendum ullamcorper sed ut ante. Vestibulum id diam quis ipsum aliquet vestibulum. Donec vulputate auctor pharetra.</p>
            <a href="#" class="btn btn-large btn-primary">Learn More</a>
        </div>
    </div>

页眉
Lorem ipsum dolor sit amet，是一位杰出的献身者。Mauris arcu dolor，孕妇权杖的格言nec，奥迪奥的秃鹫。同侧横矢状面和同侧横矢状面。毛里斯·坦普斯·亨德雷特·阿库（Mauris tempus hendrerit arcu），位于临时门厅。请坐在我的座位上。莫比坐在狮子座的前庭里，不让乌拉姆科珀坐下来。前庭内径为同侧前庭。Donec vulputate拍卖人pharetra

编辑：这里是另一个例子。

---

如果在该页面上调整窗口大小，则标题会相应调整大小。我试过查看源代码，但很难找到它。

您试过将其切换到

  <div class="container-fluid">

---

好的，我已经想出了这个办法。为便于将来参考，可使用

@介质（最大宽度：）

属性完成此操作。例如，你会做：

@media(max-width: 480px) {
  h1 {
    font-size: 12pt;
  }
}

---

或者你需要做的任何事情。希望这对将来的人有帮助！干杯

如前所述，bootstrap目前不支持即时响应的字体大小。已经显示的

@媒体（最大宽度：）

是一个不错的选择。

如果是图像标题照片（不涉及文本），使用`class=“img responsive”也可以。即：

<div class="container-fluid">
 <div class="row">
 <img src="/images/sample_photo.jpg" class="img-responsive">
 </div>
</div>

---

此处的实时示例：

发布一些相关代码，以便我们查看。您是否将响应CSS添加到页面中？它不包括在默认CSS中。是的，我有。其他响应功能也在发挥作用。这肯定是引导响应的一部分吗？是的，对不起，应该是容器流体。我复制了他们的bootstrap样式表，它本质上是bootstrap.css和bootstrap-responsive.css，混成一个文件，并尝试了它，但我仍然不明白为什么我的样式表不起作用。你是否碰巧在网上有这个我们可以看的地方？请解释你所说的“已经显示的…”是什么意思和/或添加更多代码以演示解决方案。