Last active
June 23, 2024 22:30
-
-
Save Shakil-Shahadat/2017f2faba0a2c707fb8c3c09f4c21e8 to your computer and use it in GitHub Desktop.
✓ Minimalist Bootstrap Tabs
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <title>Repeated Tasks</title> | |
| <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous"> | |
| </head> | |
| <body> | |
| <main class="container col-6 mt-3"> | |
| <nav class="nav nav-tabs nav-justified"> | |
| <button class="nav-link active" data-bs-toggle="tab" data-bs-target="#home">Home</button> | |
| <button class="nav-link" data-bs-toggle="tab" data-bs-target="#profile">Profile</button> | |
| <button class="nav-link" data-bs-toggle="tab" data-bs-target="#contact">Contact</button> | |
| </nav> | |
| <div class="tab-content"> | |
| <div class="tab-pane fade show active" id="home">ABC</div> | |
| <div class="tab-pane fade" id="profile">DEF</div> | |
| <div class="tab-pane fade" id="contact">GHI</div> | |
| </div> | |
| </main> | |
| <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment