Skip to content

Instantly share code, notes, and snippets.

@Pavaniysk
Created January 5, 2023 17:28
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Pavaniysk/2708b95a62dbf719e635182f6a22d0d7 to your computer and use it in GitHub Desktop.
Save Pavaniysk/2708b95a62dbf719e635182f6a22d0d7 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.1/dist/jquery.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<style>
body{
background-color: rgb(238, 247, 247);
fill-opacity: unset;
}
h2{
color: purple;
font-size: 40px;
text-align: center;
}
h3{
font-size: medium;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color:purple;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover {
background-color:darkblue;
}
</style>
</body>
<body>
<div class="container mt-3">
<h2>WEB DESIGNING</h2>
<br>
<!--Nav tabs-->
<ul class="nav nav-tabs">
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#Java">Java</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#BOOTSTRAP">BOOTSTRAP</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#HTML">HTML</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#CSS">CSS</a>
</li>
</ul>
<!--tab panes-->
<div class="tab-content">
<div id="Java" class="container tab-pane active"><br>
<h3>Java</h3>
<p>Java is a popular programming language, created in 1995. It is owned by Oracle, and more than 3 billion devices run Java.
It is used for:
Mobile applications (specially Android apps)
Desktop applications
Web applications
Web servers and application servers
Games
Database connection
And much, much more!</p>
</div>
<div id="BOOTSTRAP" class="container tab-pane fade"><br>
<h3>BOOTSTRAP</h3>
<p>Bootstrap is a free front-end framework for faster and easier web development. Bootstrap includes HTML and CSS based design templates for typography, forms, buttons, tables, navigation, modals, image carousels and many other, as well as optional JavaScript plugins. Bootstrap also gives you the ability to easily create responsive designs</p>
</div>
<div id="HTML" class="container tab-pane fade"><br>
<h3>HTML</h3>
<p>HTML stands for Hyper Text Markup Language. HTML is the standard markup language for creating Web pages.HTML describes the structure of a Web page. HTML consists of a series of elements. HTML elements tell the browser how to display the content. HTML elements label pieces of content such as "this is a heading", "this is a paragraph", "this is a link", etc.</p>
</div>
<div id="CSS" class="container tab-pane fade"><br>
<h3>CSS</h3>
<p>CSS stands for Cascading Style Sheets. CSS describes how HTML elements are to be displayed on screen, paper, or in other media. CSS saves a lot of work. It can control the layout of multiple web pages all at once. External stylesheets are stored in CSS files</p>
</div>
</div>
</div>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment