I made a new design for my scheinast.software domain, it looks like this:
I tryed to make the Page as light weight as possible and use less code as possible
Html code:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<!DOCTYPE html> <html lang="de"> <head> <meta charset="utf-8" /> <title>Scheinast Software</title> <link rel="stylesheet" href="/software/style.css" type="text/css"> </head> <body> <div id="PosDiv"> <div id="HeadDiv"> <h1>Scheinast Software</h1> </div> <div id="ContentDiv"> <br> <h2>Title</h2> <h3>Wir arbeiten noch ....</h3> <br> </div> <div id="FootDiv"> <a href="http://scheinast.eu/">Our Sponsor scheinast.eu</a> </div> </div> </body> </html> |
CSS code:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 |
@font-face { font-family: "hu"; src: url("/software/holyuni.ttf"); } body { background-image: url("/software/bg.jpg"); background-size: 100% auto; width: 100%; margin: 0; } h1, h2, h3, h4, h5, h6,a { font-family: "hu",sans-serif; color: rgba(99, 9, 9, 1);; font-weight: normal; text-shadow: 1px 1px 1px rgba(99, 9, 9, 1); padding: 0; } h1 { font-size: 3.2em; } h2 { font-size: 3.0em; } h3,a { font-size: 2.6em; } h4 { font-size: 2.4em; } h5 { font-size: 2.2em; } h6 { font-size: 2.0em; } #PosDiv { margin: 0 auto; width: 800px; text-align:center; height: 100vh; } #HeadDiv,#ContentDiv,#FootDiv { background: rgba(0, 0, 0, 0.86); width: 100%; margin: 20px 0px; border: 1px solid rgba(118, 14, 14, 0.4); border-radius: 4px; box-shadow: 0 1px 10px rgba(0, 0, 0, 1), 0 1px 10px rgba(0, 0, 0, 1) inset; } #HeadDiv { height:auto; } #ContentDiv { min-height: 100%; height: 100%; margin: 0 auto; } #FootDiv { height:auto; } |
Background image:
