<div class="bs-callout bs-callout-warning">
<h4>Mobile device caveats</h4>
- <p>There are some caveats regarding using form controls within fixed elements on mobile devices. <a href="../getting-started#support-fixed-position-keyboards">See our browser support docs</a> for details.</p>
+ <p>There are some caveats regarding using form controls within fixed elements on mobile devices. <a href="../getting-started/#support-fixed-position-keyboards">See our browser support docs</a> for details.</p>
</div>
<div class="bs-callout bs-callout-danger">
<div class="bs-callout bs-callout-warning">
<h4>Context-specific usage</h4>
- <p>Like the standard <a href="../css#buttons">button classes</a>, <code>.navbar-btn</code> can be used on <code><a></code> and <code><input></code> elements. However, neither <code>.navbar-btn</code> nor the standard button classes should be used on <code><a></code> elements within <code>.navbar-nav</code>.</p>
+ <p>Like the standard <a href="../css/#buttons">button classes</a>, <code>.navbar-btn</code> can be used on <code><a></code> and <code><input></code> elements. However, neither <code>.navbar-btn</code> nor the standard button classes should be used on <code><a></code> elements within <code>.navbar-nav</code>.</p>
</div>
<h2 id="navbar-text">Text</h2>
<h3 id="helper-classes-screen-readers">Screen reader content</h3>
- <p>Hide an element to all devices <strong>except screen readers</strong> with <code>.sr-only</code>. Necessary for following <a href="../getting-started#accessibility">accessibility best practices</a>. Can also be used as a mixin.</p>
+ <p>Hide an element to all devices <strong>except screen readers</strong> with <code>.sr-only</code>. Necessary for following <a href="../getting-started/#accessibility">accessibility best practices</a>. Can also be used as a mixin.</p>
{% highlight html %}
<a class="sr-only" href="#content">Skip to main content</a>
{% endhighlight %}
<div class="page-header">
<h1 id="template">Basic template</h1>
</div>
- <p class="lead">Start with this basic HTML template, or modify <a href="../getting-started#examples">these examples</a>. We hope you'll customize our templates and examples, adapting them to suit your needs.</p>
+ <p class="lead">Start with this basic HTML template, or modify <a href="#examples">these examples</a>. We hope you'll customize our templates and examples, adapting them to suit your needs.</p>
<p>Copy the HTML below to begin working with a minimal Bootstrap document.</p>
{% highlight html %}
<img src="../examples/screenshots/non-responsive.jpg" alt="">
</a>
<h4>Non-responsive Bootstrap</h4>
- <p>Easily disable the responsiveness of Bootstrap <a href="../getting-started/#disable-responsive">per our docs</a>.</p>
+ <p>Easily disable the responsiveness of Bootstrap <a href="#disable-responsive">per our docs</a>.</p>
</div>
<div class="col-xs-6 col-md-4">
<a class="thumbnail" href="../examples/theme/">
</div>
<div class="bs-callout bs-callout-warning">
<h4>Mobile device caveats</h4>
- <p>There are some caveats regarding using modals on mobile devices. <a href="../getting-started#fixed-position-keyboards">See our browser support docs</a> for details.</p>
+ <p>There are some caveats regarding using modals on mobile devices. <a href="../getting-started/#support-fixed-position-keyboards">See our browser support docs</a> for details.</p>
</div>
<h3>Static example</h3>
{% endhighlight %}
<h3>Markup</h3>
- <p>You can activate a tab or pill navigation without writing any JavaScript by simply specifying <code>data-toggle="tab"</code> or <code>data-toggle="pill"</code> on an element. Adding the <code>nav</code> and <code>nav-tabs</code> classes to the tab <code>ul</code> will apply the Bootstrap <a href="../components#nav-tabs">tab styling</a>, while adding the <code>nav</code> and <code>nav-pills</code> classes will apply <a href="../components#nav-pills">pill styling</a>.</p>
+ <p>You can activate a tab or pill navigation without writing any JavaScript by simply specifying <code>data-toggle="tab"</code> or <code>data-toggle="pill"</code> on an element. Adding the <code>nav</code> and <code>nav-tabs</code> classes to the tab <code>ul</code> will apply the Bootstrap <a href="../components/#nav-tabs">tab styling</a>, while adding the <code>nav</code> and <code>nav-pills</code> classes will apply <a href="../components/#nav-pills">pill styling</a>.</p>
{% highlight html %}
<!-- Nav tabs -->
<ul class="nav nav-tabs">