Ruby on Rails 5, Vorlage mit Registerkarten

Question

Ich versuche herauszufinden, wie ich eine Tabbed-Site ähnlich der folgenden Abbildung implementieren kann. Kennt jemand diese Vorlage oder kann mich anleiten, wie ich mit Bootstrap und CSS etwas Ähnliches gestalten kann?

Answer 1

Bootstrap hat eine Javascript-Tab-Plugin enthalten Tabs Klicken zu ändern. Sie können https://v4-alpha.getbootstrap.com/components/navs/#javascript-behavior

Kasse Wenn Sie die Seiten wollen eine neue Seite laden auf, klicken Sie so etwas wie tun könnte (ich habe font genial für die Symbole verwendet hier)

<ul class="nav nav-tabs"> 
    <li class="nav-item"> 
    <a class="nav-link active" href="/sourcing"><i class="fa fa-pie-chart"></i>Sourcing</a> 
    </li> 
    <li class="nav-item"> 
    <a class="nav-link" href="/people"><i class="fa fa-user-o"></i>People</a> 
    </li> 
</ul> 

In Bootstrap-4 diese bekommen würde Das grundlegende Beispiel funktioniert und Sie könnten mit dem CSS herumspielen, um das Aussehen von jedem zu ändern, wenn es die "aktive" Klasse

hat