I'm feeling a bit lost when it comes to understanding how linking to an element within a page functions. As I delve into the starter template for Twitter Bootstrap, I encounter the following code snippet in the navbar:
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
It seems clear that there are anchor tags to #about
and #contact
within the list elements, but where is the actual content defined? In the provided example site, the .starter-template
div remains constant regardless of which navbar button is clicked. How can I alter the div upon clicking a navbar button? I attempted the following, resulting in just generating a large link as expected:
<a name="about">
<div class="container">
<div class="starter-template">
<h1>About.</h1>
<p class="lead">#about</p>
</div>
</div>
</a>
Your guidance would be greatly appreciated!
~Carpetfizz