Difference between revisions of "Making an "Under Construction" page"

From Imaginet FAQ
Jump to navigation Jump to search
Line 1: Line 1:
−
 
+
  <html>
−
 
+
  <head>
−
<code>
+
      <title>Under construction</title>
−
<html>
+
      <meta name="This website is under construction">
−
<head>
+
      <meta name="viewport" content="height=device-height, initial-scale=1">
−
    <title>Under construction</title>
+
      <meta http-equiv="content-type" content="text/html; charset=UTF-8">
−
    <meta name="This website is under construction">
+
      <style>
−
    <meta name="viewport" content="height=device-height, initial-scale=1">
+
          /* Container holding the image and the text */
−
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
+
          .page {
−
    <style>
+
              position: relative;
−
        /* Container holding the image and the text */
+
              text-align: center;
−
        .page {
+
              color: black;
−
            position: relative;
+
              display: flex;
−
            text-align: center;
+
              justify-content: center;
−
            color: black;
+
              overflow: hidden;
−
            display: flex;
+
              height: 100vh;
−
            justify-content: center;
+
          }
−
            overflow: hidden;
+
          /* Centered text */
−
            height: 100vh;
+
          .centered {
−
        }
+
              position: absolute;
−
        /* Centered text */
+
              top: 50%;
−
        .centered {
+
              left: 50%;
−
            position: absolute;
+
              transform: translate(-50%, -50%);
−
            top: 50%;
+
              font-size: 2em;
−
            left: 50%;
+
          }
−
            transform: translate(-50%, -50%);
+
          /* style of space behind the image */
−
            font-size: 2em;
+
          body {
−
        }
+
              background-color: black;
−
        /* style of space behind the image */
+
          }
−
        body {
+
      </style>
−
            background-color: black;
+
  </head>
−
        }
+
  <body>
−
    </style>
+
      <div class="page">
−
</head>
+
      <img src="background.png" alt="Under construction page">
−
<body>
+
          <div class="centered">
−
    <div class="page">
+
          <p><center>
−
    <img src="background.png" alt="Under construction page">
+
              My website
−
        <div class="centered">
+
              </br>
−
        <p><center>
+
              Coming soon
−
            My website
+
          </center></p>
−
            </br>
+
          </div>
−
            Coming soon
+
      </div>
−
        </center></p>
+
  </body>
−
        </div>
+
  </html>
−
    </div>
 
−
</body>
 
−
</html>
 
−
</code>
 

Revision as of 17:33, 16 February 2023

 <html>
 <head>
     <title>Under construction</title>
     <meta name="This website is under construction">
     <meta name="viewport" content="height=device-height, initial-scale=1">
     <meta http-equiv="content-type" content="text/html; charset=UTF-8">
     <style>
         /* Container holding the image and the text */
         .page {
             position: relative;
             text-align: center;
             color: black;
             display: flex;
             justify-content: center;
             overflow: hidden;
             height: 100vh;
         }
         /* Centered text */
         .centered {
             position: absolute;
             top: 50%;
             left: 50%;
             transform: translate(-50%, -50%);
             font-size: 2em;
         }
         /* style of space behind the image */
         body {
             background-color: black;
         }
     </style>
 </head>
 <body>
     <img src="background.png" alt="Under construction page">

             My website
             
Coming soon

 </body>
 </html>