Bioluminati (Talk | contribs) |
|||
Line 1: | Line 1: | ||
{{Template:IIT_Kanpur}} | {{Template:IIT_Kanpur}} | ||
+ | <html> | ||
+ | <head> | ||
+ | <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
+ | <style> | ||
+ | body, html { | ||
+ | height: 100%; | ||
+ | margin: 0; | ||
+ | font-family: Arial, Helvetica, sans-serif; | ||
+ | } | ||
+ | |||
+ | .hero-image { | ||
+ | background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("https://static.igem.org/mediawiki/2018/f/f9/T--IIT_Kanpur--Swash_Effect01.png"); | ||
+ | height: 50%; | ||
+ | background-position: center; | ||
+ | background-repeat: no-repeat; | ||
+ | background-size: cover; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | .hero-text { | ||
+ | text-align: center; | ||
+ | position: absolute; | ||
+ | top: 50%; | ||
+ | left: 50%; | ||
+ | transform: translate(-50%, -50%); | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | .hero-text button { | ||
+ | border: none; | ||
+ | outline: 0; | ||
+ | display: inline-block; | ||
+ | padding: 10px 25px; | ||
+ | color: black; | ||
+ | background-color: #ddd; | ||
+ | text-align: center; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | .hero-text button:hover { | ||
+ | background-color: #555; | ||
+ | color: white; | ||
+ | } | ||
+ | </style> | ||
+ | </head> | ||
+ | <body> | ||
+ | |||
+ | <div class="hero-image"> | ||
+ | <div class="hero-text"> | ||
+ | <h1 style="font-size:50px">I am John Doe</h1> | ||
+ | <p>And I'm a Photographer</p> | ||
+ | <button>Hire me</button> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <p>Page Content..</p> | ||
+ | |||
+ | </body> | ||
+ | </html> | ||
+ | |||
<html> | <html> |
Revision as of 07:53, 6 December 2018