estoy haciendo un ejercicio que me pide una página web con 2 pestañas utilizando Bootstrap además de HTML. Tengo este código HTML (lo pongo desde la etiqueta body porque no me deja poner más):
<body>
<div class="container">
<div class="jumbotron">
<h1 class="display-4">Atención</h1>
<p class="lead">Esta página es solo una prueba de Bootstrap</p>
<hr class="my-4">
</div>
<ul class="nav nav-tabs">
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#pestaña-uno">Pestaña 1</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#pestaña-dos">Pestaña 2</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane container active" id="pestaña-uno">
<h1>Este es el contenido de la pestaña 1</h1>
</div>
<div class="tab-pane container fade" id="pestaña-dos">
<h1>Este es el contenido de la pestaña 2</h1>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src=https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js integrity="sha384UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
</body>
La cuestión es que no me muestra nada al pinchar en "Pestaña 2", como que no navega de una pestaña a otra, y me muestra el contenido de las 2 pestañas en la "Pestaña 1". ¿Alguien sabe por qué y cómo lo puedo solucionar?