Php Flow » CSS

Simple example with help Twitter Bootstrap

Hi,
Below is simple example of bootstrap library.Its very rich UI library.

  1. <html lang=“en”>  
  2.   <head>  
  3.     <meta charset=“utf-8″>  
  4.     <title>Upgrading · Twitter Bootstrap</title>  
  5.     <meta name=“viewport” content=“width=device-width, initial-scale=1.0″>  
  6.   
  7.     <!– Le styles –>  
  8.     <link href=“assets/css/bootstrap.css” rel=“stylesheet”>  
  9.     <link href=“assets/css/bootstrap-responsive.css” rel=“stylesheet”>  
  10.     <link href=“assets/css/docs.css” rel=“stylesheet”>  
  11.   
  12.   </head>  
  13.   
  14.   <body>  
  15.     <div class=“navbar navbar-fixed-top”>   
  16. <div class=“tab-content”>  
  17.           <div id=“lA” class=“tab-pane active”>  
  18.             <p>I’m in Section A.</p>  
  19.           </div>  
  20.           <div id=“lB” class=“tab-pane”>  
  21.             <p>Howdy, I’m in Section B.</p>  
  22.           </div>  
  23.           <div id=“lC” class=“tab-pane”>  
  24.             <p>What up girl, this is Section C.</p>  
  25.           </div>  
  26.         </div>  
  27.       </div>  
  28. <script type=“text/javascript” src=“http://platform.twitter.com/widgets.js”></script>  
  29.     <script src=“assets/js/jquery.js”></script>  
  30.     <script src=“assets/js/google-code-prettify/prettify.js”></script>  
  31.     <script src=“assets/js/bootstrap-transition.js”></script>  
  32.     <script src=“assets/js/bootstrap-alert.js”></script>  
  33.     <script src=“assets/js/bootstrap-modal.js”></script>  
  34.     <script src=“assets/js/bootstrap-dropdown.js”></script>  
  35.     <script src=“assets/js/bootstrap-scrollspy.js”></script>  
  36.     <script src=“assets/js/bootstrap-tab.js”></script>  
  37.     <script src=“assets/js/bootstrap-tooltip.js”></script>  
  38.     <script src=“assets/js/bootstrap-popover.js”></script>  
  39.     <script src=“assets/js/bootstrap-button.js”></script>  
  40.     <script src=“assets/js/bootstrap-collapse.js”></script>  
  41.     <script src=“assets/js/bootstrap-carousel.js”></script>  
  42.     <script src=“assets/js/bootstrap-typeahead.js”></script>  
  43.   </body>  
  44. </html>  

Did you enjoy this article? Share it!

About the Author:

Hi, This is Parvez Alam from India. I am software developer with 4 years’ experience in web development. I have submitted articles on PHP, Mysql, Magento,CSS, HTML, jQuery, web designing and social API. You can subscribe to my blog via RSS/Twitter/Google plus and Facebook.

Random Posts

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>