HTML

HTML Template 2

Nov 17th, 2016
190
0
Never
1
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 2.35 KB | None | 0 0
  1. <!--
  2.  
  3. Code written by Jacob Howard
  4. 11/17/16
  5. If you wish to use this template, you do not have to ask for permission.
  6. If you wish to use this template for commercial purposes, please leave this comment.
  7.  
  8. -->
  9. <!DOCTYPE html>
  10. <html>
  11. <head>
  12. <meta charset="UTF-8">
  13. <title>Code Template 2</title>
  14. <style>
  15. /*
  16.  
  17. Code written by Jacob Howard
  18. 11/17/16
  19. If you wish to use this template, you do not have to ask for permission.
  20. If you wish to use this template for commercial purposes, please leave this comment.
  21.  
  22. */
  23. body {
  24.             background:#FFF;
  25.             color:#2520B6;
  26.             font-family:"Arial Narrow", sans-serif;
  27.             font-size:1.4em;
  28. }
  29. #wrapper {
  30.             width:80%;
  31.             max-width:1600px;
  32.             min-width:720px;
  33.             margin-left:auto;
  34.             margin-right:auto;
  35.             padding:15px;
  36.             margin-top:2%;
  37. }
  38. #holder {
  39.             border:none;
  40.             width:100%;
  41. }
  42. #leftcol {
  43.             border:none;
  44.             width:19%;
  45.             height:100%;
  46. }
  47. #righcol {
  48.             border:2px solid #2520B6;
  49.             border-radius:15px;
  50.             width:79%;
  51. }
  52. #tophead {
  53.             text-align:center;
  54.             border:none;
  55. }
  56. nav button {
  57.             border:2px solid #2520B6;
  58.             height:75px;
  59.             width:100%;
  60.             font-family:"Arial Narrow", sans-serif;
  61.             color:#2520B6;
  62.             background:#FFF;
  63.             font-size:1.4em;
  64.             margin-top:5px;
  65.             margin-bottom:5px;
  66.             -moz-transition: all .2s ease-in;
  67.             -o-transition: all .2s ease-in;
  68.             -webkit-transition: all .2s ease-in;
  69. }
  70. nav button:hover {
  71.             background:#2520B6;
  72.             color:#FFF;
  73. }
  74. #topbtn {
  75.             border-radius:15px 15px 0px 0px;
  76. }
  77. #btmbtn {
  78.             border-radius:0px 0px 15px 15px;
  79. }
  80. </style>
  81. </head>
  82. <body>
  83. <div id="wrapper">
  84. <table id="holder" border="1">
  85. <tr>
  86. <td id="tophead" colspan="2">
  87. <header>
  88. <h1>Code Template 2</h1>
  89. </header>
  90. </td>
  91. </tr>
  92. <tr>
  93. <td id="leftcol">
  94. <!--
  95.  
  96. URLs go here. Replace "#" with the link you wish for it to lead.
  97. i.e. "https://www.google.com/"
  98. To make the page open in a new tab, add the attribute ' target="_blank" '
  99. i.e. <a href="https://www.google.com/" target="_blank">
  100.  
  101. -->
  102. <nav>
  103. <a href="#"><button id="topbtn">Page 1</button></a>
  104. <a href="#"><button>Page 2</button></a>
  105. <a href="#"><button>Page 3</button></a>
  106. <a href="#"><button>Page 4</button></a>
  107. <a href="#"><button id="btmbtn">Page 5</button></a>
  108. </nav>
  109. </td>
  110. <!--
  111.  
  112. Box on the rightmost-side of the page. Ideal container for main content.
  113.  
  114. -->
  115. <td id="righcol">
  116.  
  117. </td>
  118. </table>
  119. </div>
  120. </body>
  121. </html>
Advertisement
Comments
  • User was banned
Add Comment
Please, Sign In to add comment