Advertisement
Guest User

Untitled

a guest
Sep 18th, 2014
172
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.54 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>Screaming Storm</title>
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <link href = "css/bootstrap.css" rel = "stylesheet">
  7. </head>
  8. <body>
  9.  
  10. <div class = "navbar navbar-inverse navbar-static-top">
  11. <div class = "container">
  12.  
  13. <a href = "#" class = "navbar-brand">Screaming Storm</a>
  14.  
  15. <button class = "navbar-toggle" data-toggle = "collapse" data-target = ".navHeaderCollapse">
  16. <span class = "icon-bar"></span>
  17. <span class = "icon-bar"></span>
  18. <span class = "icon-bar"></span>
  19. </button>
  20.  
  21. <div class = "collapse navbar-collapse navHeaderCollapse">
  22.  
  23. <ul class = "nav navbar-nav navbar-right">
  24.  
  25. <li class = "active"><a href = "#">Home</a></li>
  26. <li><a href = "#">Blog</a></li>
  27. <li class = "dropdown">
  28.  
  29. <a href = "#" class = "dropdown-toggle" data-toggle = "dropdown">Social Media <b class = "caret"></b></a>
  30. <ul class = "dropdown-menu">
  31. <li><a href = "#">Twitter</a></li>
  32. <li><a href = "#">Facebook</a></li>
  33. <li><a href = "#">Google+</a></li>
  34. <li><a href = "#">Instagram</a></li>
  35. </ul>
  36.  
  37. </li>
  38. <li><a href = "#">About</a></li>
  39. <li><a href = "#contact" data-toggle="modal">Contact</a></li>
  40. </ul>
  41. </div>
  42. </div>
  43. </div>
  44.  
  45.  
  46. <div class = "container">
  47.  
  48. <div class = "jumbotron text-center">
  49. <h1>Hello Screaming Storm!</h1>
  50. <p>Wisi decore appareat vix ad, et doctus apeirian has? Ius persius deseruisse te! Ea summo diceret mea! Mea elitr oporteat id, meis simul eu vis?</p>
  51. <a class = "btn btn-default">Watch now!</a>
  52. <a class = "btn btn-info">Tweet it!</a>
  53. </div>
  54.  
  55. </div>
  56.  
  57. <div class = "container">
  58.  
  59. <div class = "row bottom-buffer">
  60.  
  61. <div class = "col-md-3">
  62.  
  63. <h3><a href "#">Lamp Industry</a></h3>
  64. <p>Mollis persius temporibus vel eu. Usu in modo hinc diceret, an summo intellegebat vim. In mea temporibus consectetuer, cetero aperiri ius at. At qui brute disputando, hinc omnis delicatissimi mel ea! Etiam mollis electram an per, ex eum sale ludus dictas, cu nam veri everti dolorem. Mundi recusabo repudiandae vel te.</p>
  65. <a href = "#" class = "btn btn-default">Read more</a>
  66.  
  67. </div>
  68.  
  69. <div class = "col-md-3">
  70.  
  71. <h3><a href "#">Bike Industry</a></h3>
  72. <p>Lorem ipsum dolor sit amet, usu ea liber laoreet efficiantur. Esse equidem in eos? Per at nibh inani, ex nec cetero salutandi principes, tritani nostrum detracto has ad. Etiam impetus euripidis ea pro, sit et affert tincidunt dissentias, id veniam exerci fierent eos. Per in audiam cotidieque, illud ocurreret ne nec, ei nec odio nemore possim?</p>
  73. <a href = "#" class = "btn btn-default">Read more</a>
  74.  
  75. </div>
  76.  
  77. <div class = "col-md-3">
  78.  
  79. <h3><a href "#">Door Industry</a></h3>
  80. <p>Lorem ipsum dolor sit amet, albucius luptatum eam ut, pri paulo argumentum ne. Ex ius nibh tempor nemore, te alia paulo volutpat sed. At simul voluptua eos, unum ignota expetendis id pri. Suas choro ei vis. Vim ea stet docendi scribentur.</p>
  81. <a href = "#" class = "btn btn-default">Read more</a>
  82.  
  83. </div>
  84.  
  85. <div class = "col-md-3">
  86.  
  87. <h3><a href "#">Chair Industry</a></h3>
  88. <p>Lorem ipsum dolor sit amet, has noster tacimates postulant ex! Ea vel utinam tritani vocibus, electram salutandi vel te. Eum ei inciderint philosophia, dicant tincidunt pri an. No regione convenire duo, ludus putant dignissim ad nec, quaeque facilisis at qui. Vitae ignota gubergren id cum, graeco forensibus intellegam his et.</p>
  89. <a href = "#" class = "btn btn-default">Read more</a>
  90.  
  91. </div>
  92.  
  93. </div>
  94.  
  95. </div>
  96.  
  97. <div class = "navbar navbar-default navbar-fixed-bottom">
  98.  
  99. <div class = "container">
  100. <p class = "navbar-text pull-left">Site built by Sjoerdoh</p>
  101. <a href = "#" class = "navbar-btn btn-danger btn pull-right">YouTube</a>
  102. </div>
  103.  
  104. </div>
  105.  
  106. <div class="modal fade bs-example-modal-lg" id = "contact" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  107. <div class="modal-dialog modal-md">
  108. <div class="modal-content">
  109. <h4>Contact</h4>
  110.  
  111. <div class = "form-group">
  112. <label for = "contact-name" class = "col-lg-2 control-label">Name</label>
  113. <div class = "col-lg-10">
  114. <input type = "text" class = "form-control" id = "contact-name" placeholder = "Full Name">
  115. </div>
  116. </div>
  117.  
  118. <div class = "form-group">
  119. <label for = "contact-email" class = "col-lg-2 control-label">Email</label>
  120. <div class = "col-lg-10">
  121. <input type = "email" class = "form-control" id = "contact-email" placeholder = "you@example.com">
  122. </div>
  123. </div>
  124.  
  125. <div class = "form-group">
  126. <label for = "contact-message" class = "col-lg-2 control-label">Message</label>
  127. <div class = "col-lg-10">
  128.  
  129. <textarea class = "form-control" rows = "8"> </textarea>
  130.  
  131. </div>
  132. </div>
  133.  
  134.  
  135. <div class = "modal-footer">
  136. <a class = "btn btn-default" data-dismiss = "modal">Close</a>
  137. <button class = "btn btn-primary" type = "submit">Send</button>
  138. </div>
  139. </div>
  140. </div>
  141. </div>
  142.  
  143. <script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
  144. <script src = "js/bootstrap.js"></script>
  145.  
  146. </body>
  147. <html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement