Bootstrap Tabs funktioniert nicht, aber der Code sieht gut aus

Dies ist das erste Mal, dass meine Bootstrap-Registerkarten nicht funktionieren, mein Code ist einfach und alles sieht OK aus, aber auf meinem System funktioniert es nicht.Bootstrap Tabs funktioniert nicht, aber der Code sieht gut aus

Im Anschluss an mein Code

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
    <title>Tabs </title> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" media="screen" title="no title"> 
</head> 
<body> 
    <div class="container"> 
     <ul class="nav nav-tabs" id="myTab"> 
      <li class="active"><a href="#home">Home</a></li> 
      <li><a href="#profile">Profile</a></li> 
      <li><a href="#messages">Messages</a></li> 
      <li><a href="#settings">Settings</a></li> 
     </ul> 

     <div class="tab-content"> 
      <div class="tab-pane active" id="home">home</div> 
      <div class="tab-pane" id="profile">profile</div> 
      <div class="tab-pane" id="messages">messages</div> 
      <div class="tab-pane" id="settings">settings</div> 
     </div> 
    </div> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
</body> 
</html>

Quelle

2016-11-03 Muhammad Talha

hinzufügen Daten-Toggle = "Tab"

<!DOCTYPE html> 
<html lang="ENG"> 
<head> 
    <!-- Required meta tags always come first--> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Title Page</title> 

    <!-- Bootstrap CSS --> 
    <link rel="stylesheet" href="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/css/bootstrap.css"> 
    </head> 
    <body> 
    <div class="container"> 
    <ul class="nav nav-tabs"> 
     <li class="nav-item"> 
      <a data-toggle="tab" href="#home" class="nav-link active">Active 1</a> 
     </li> 
     <li class="nav-item"> 
      <a data-toggle="tab" href="#profile" class="nav-link">Active 2</a> 
     </li> 
     <li class="nav-item"> 
      <a data-toggle="tab" href="#message" class="nav-link">Active 3</a> 
     </li> 
     <li class="nav-item"> 
      <a data-toggle="tab" href="#settings" class="nav-link">Disabled</a> 
     </li> 
    </ul> 

    <div class="tab-content"> 
     <div class="tab-pane fade in active" id="home">home</div> 
     <div class="tab-pane fade" id="profile">profile</div> 
     <div class="tab-pane fade" id="message">messages</div> 
     <div class="tab-pane fade" id="settings">settings</div> 
    </div> 
    </div> 

    <!-- jQuery --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
    <!-- Bootstrap JavaScript --> 
    <script src="https://www.atlasestateagents.co.uk/javascript/tether.min.js"></script><!-- Tether for Bootstrap --> 
    <script src="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/js/bootstrap.js"></script> 
    </body> 
    </html>

zu verankern

Quelle

2016-11-03 08:28:21

Bootstrap Tabs funktioniert nicht, aber der Code sieht gut aus

Antwort

Verwandte Themen