A Jumbotron in Bootstrap Web UI framework is a huge box-shaped component that is displayed on the page to draw user attention to some important content.
-According to Bootstrap Jumbotron is a lightweight, flexible component that can optionally extend the entire viewport to showcase key content on your site.The default color of Jumbotron is gray with rounded corners. A jumbotron is the CSS class for creating Jumbotron, It contains an H1 tag along with a p tag to display some text inside it.
Code Snippet: jumbotron-example.html<!DOCTYPE html>
<head>
<title>What is Bootstrap Jumbotron?</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="jumbotron">
<h1>What is Bootstrap Jumbotron?</h1>
<p>A jumbotron is a huge box that is displayed on the page to draw attention of some important content.</p>
</div>
</div>
</body>
</html>
More Posts related to Bootstrap,
- Rounded Images in Bootstrap framework
- Simple Login Page using Bootstrap
- Make Bootstrap Button look like a link
- Create Bootstrap carousel slider with Text
- What is Bootstrap Jumbotron and how to use it
- Align left align text in Bootstrap
- Right Align Text in Bootstrap framework
- Bootstrap tooltip not working
- How to add hint text in bootstrap input text field and text area
- How to Change Bootstrap Carousel Slide Speed
- Bootstrap Nav Menu Dropdown on hover
- [Solved] Bootstrap tooltip not working
More Posts:
- Notepad++ Convert text from lower to upper case - NotepadPlusPlus
- Difference between using Scanner Class and String args for user input in Java - Java
- How to Change Eclipse Default Web Browser - Eclipse
- Facebook : Warning: Request without access token missing application ID or client token - Facebook
- How to recover unsaved notepad file Windows 10 - NotepadPlusPlus
- This Toast was not created with Toast.makeText() : Android RuntimeException - Android
- Maven Unsupported major.minor version 51.0 - Java
- Toast not getting displayed Android App - Android
- How to reset eclipse layout - Android
- Upload docx file using PHP script - PHP
- Comprehensive 256 Ascii code table with Html Hex IBM Microsoft Key - Html
- reCAPTCHA Implementation Tutorial - CSS
- import servlet API to eclipse project (javax.servlet cannot be resolved error) - Java
- Android: Unknown error code during application install : - Android
- [Solved] SharePoint Search Internal server error exception - SharePoint