Advertisement
Guest User

kalender

a guest
Oct 15th, 2019
125
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.13 KB | None | 0 0
  1. ***html***
  2.  
  3. <!DOCTYPE html>
  4. <html lang="nl">
  5. <head>
  6. <meta charset="UTF-8">
  7. <link rel="stylesheet" href="../css/dier.css"/>
  8. <link rel="shortcut icon" href="../media/images/favicons/favicon.ico" type="image/x-icon"/>
  9. <title>Kalender</title>
  10. </head>
  11. <body>
  12. <h1>Kalender</h1>
  13. <header>
  14. <nav class = "menu">
  15. <h2 class="verborgen">Menu</h2>
  16.  
  17. <ul>
  18. <li><a href="../index.html"> Home </a></li>
  19. <li><a href="kalender.html">Kalender</a></li>
  20. <li class="sub-menu">
  21. <a href="kenmerken.html"> Kenmerken </a>
  22. <ul>
  23. <li> <a href="verspreiding_leefgebied.html">Verspreiding en leefgebied</a></li>
  24. <li class="sub-menu">
  25. <a href="fotos.html">Foto's</a>
  26. <ul>
  27. <li><a href="detailfotos/detailfoto1.html">Foto 1</a></li>
  28. <li><a href="detailfotos/detailfoto2.html">Foto 2</a></li>
  29. <li><a href="detailfotos/detailfoto3.html">Foto 3</a></li>
  30. </ul>
  31. </li>
  32. <li><a href="voedsel_gedrag.html">Voedsel en gedrag</a></li>
  33. </ul>
  34. </li>
  35. <li><a href="bedreiging.html"> Bedreigingen </a></li>
  36. </ul>
  37. <hr/>
  38. </nav>
  39. </header>
  40.  
  41. <main>
  42. <h3>Verjaardagskalender</h3>
  43. <center> <table border="1" class="kalender">
  44. <tr>
  45. <td colspan="5" class="maand">december</td>
  46. <td colspan="2" class="jaar">2019</td>
  47. </tr>
  48. <tr class="week">
  49. <td>Maandag</td>
  50. <td>Dinsdag</td>
  51. <td>Woensdag</td>
  52. <td>Donderdag</td>
  53. <td>Vrijdag</td>
  54. <td>Zaterdag</td>
  55. <td>Zondag</td>
  56. </tr>
  57. <tr>
  58. <td class="dag"> </td>
  59. <td class="dag"> </td>
  60. <td class="dag"> </td>
  61. <td class="dag"> </td>
  62. <td class="dag"> </td>
  63. <td class="weekend"> </td>
  64. <td class="weekend">1</td>
  65. </tr>
  66. <tr>
  67. <td class="dag">2</td>
  68. <td class="dag">3</td>
  69. <td class="dag">4</td>
  70. <td class="dag">5</td>
  71. <td class="dag">6</td>
  72. <td class="weekend">7</td>
  73. <td class="weekend">8</td>
  74. </tr>
  75. <tr>
  76. <td class="dag">9</td>
  77. <td class="dag">10</td>
  78. <td class="dag">11</td>
  79. <td class="dag"> <a href="fotos.html">12</a> </td>
  80. <td class="dag">13</td>
  81. <td class="weekend">14</td>
  82. <td class="weekend">15</td>
  83. </tr>
  84. <tr>
  85. <td class="dag">16</td>
  86. <td class="dag">17</td>
  87. <td class="dag">18</td>
  88. <td class="dag">19</td>
  89. <td class="dag">20</td>
  90. <td class="weekend">21</td>
  91. <td class="weekend">22</td>
  92. </tr>
  93. <tr>
  94. <td class="dag">23</td>
  95. <td class="dag">24</td>
  96. <td class="dag">25</td>
  97. <td class="dag">26</td>
  98. <td class="dag">27</td>
  99. <td class="weekend">28</td>
  100. <td class="weekend">29</td>
  101. </tr>
  102. <tr>
  103. <td class="dag">30</td>
  104. <td class="dag">31</td>
  105. <td class="dag"> </td>
  106. <td class="dag"> </td>
  107. <td class="dag"> </td>
  108. <td class="weekend"> </td>
  109. <td class="weekend"> </td>
  110. </tr>
  111. <tr class="week">
  112. <td>Maandag</td>
  113. <td>Dinsdag</td>
  114. <td>Woensdag</td>
  115. <td>Donderdag</td>
  116. <td>Vrijdag</td>
  117. <td>Zaterdag</td>
  118. <td>Zondag</td>
  119. </tr>
  120. </table> </center>
  121. </main>
  122.  
  123. </body>
  124. </html>
  125.  
  126. ***css***
  127.  
  128. .kalender{
  129. border: palevioletred;
  130. }
  131. .maand{
  132. text-transform: uppercase;
  133. font-size: 24pt;
  134. color: white;
  135. background-color: palevioletred;
  136. height: 90px;
  137. }
  138. .jaar{
  139. font-size: 24pt;
  140. color: white;
  141. background-color: palevioletred;
  142. height: 90px;
  143. }
  144. .week{
  145. text-transform: uppercase;
  146. font-size: 8pt;
  147. color: white;
  148. background-color: palevioletred;
  149. height: 20px;
  150. }
  151. .dag{
  152. font-size: 24pt;
  153. text-align: right;
  154. vertical-align: bottom;
  155. background-color: antiquewhite;
  156. color: lightcoral;
  157. height: 75px;
  158. width: 75px;
  159. }
  160. .weekend{
  161. font-size: 24pt;
  162. text-align: right;
  163. vertical-align: bottom;
  164. background-color: lightcoral;
  165. color: antiquewhite;
  166. height: 75px;
  167. width: 75px;
  168. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement