Advertisement
Ombashi

Time gamma 2 WIP

Oct 2nd, 2020
57
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 1.25 KB | None | 0 0
  1. <!DOCTYPE>
  2. <html>
  3.    
  4.     <div class = 'entire'>
  5.    
  6.     <p class = 'txt'>Time &amp; Date</p>
  7.        
  8.         <div>
  9.        
  10.             <button class = 'butone' onclick = 'myTime()'>Time</button>
  11.        
  12.         </div>
  13.        
  14.         <p id = 'output'></p>
  15.        
  16.        
  17.         </div>
  18.  
  19. <style>
  20.    
  21.     /* Body */
  22.    
  23.     .txt {
  24.        
  25.         font-family: sans-serif;
  26.         position: relative;
  27.         left: 640px;
  28.         font-size: 30px;
  29.     }
  30.    
  31.     .entire {
  32.        
  33.         padding: 20px 20px;
  34.         border: 2px solid #000000;
  35.         border-radius: 25px;
  36.     }
  37.    
  38.     /* Flexbox */
  39.    
  40.     .flex {
  41.        
  42.         display: flex;
  43.         margin: 1px;
  44.        
  45.     }
  46.    
  47.     .row {
  48.        
  49.         flex-direction: row;
  50.         width: 100%;
  51.         flex-wrap: wrap;
  52.         display: flex;
  53.     }
  54.    
  55.     .colone {
  56.        
  57.         flex: 1;
  58.         display: flex;
  59.         flex-direction: column;
  60.         flex-basis: 100%;
  61.     }
  62.    
  63.     /* Buttons */
  64.    
  65.     .butone {
  66.        
  67.     padding: 16px 16px;
  68.     border-radius: 25px;
  69.     background-color: #FFFFFF;
  70.     border: 2px solid #000000;
  71.     font-size: 15px;
  72.  
  73.     }
  74.    
  75.     .butone:hover {
  76.        
  77.         background-color: #000000;
  78.         cursor: pointer;
  79.         color: #FFFFFF;
  80.  
  81.     }
  82.  
  83.     </style>
  84.        
  85.         <script>
  86.            
  87.             function myTime() {
  88.                
  89.                 var t = new Date;
  90.                
  91.                 var y = new Date;
  92.                
  93.                 document.getElementById('output').innerHTML = `The current time is ${t.getUTCHours()}:${y.getMinutes()}`;
  94.                
  95.             }
  96.            
  97.         </script>
  98.    
  99. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement