S I T E ' S - N A M E

Lailailailaa!!!

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed vitae gravida urna. Pellentesque id lorem et magna fringilla porttitor tristique nec velit. Curabitur vel tortor mattis urna dictum ultricies. Cras a feugiat tortor. In pretium, enim sit amet vehicula dictum, mi quam commodo turpis, sed pharetra enim purus vel augue. Mauris ut arcu nulla. Pellentesque sit amet iaculis sem. Etiam mattis adipiscing accumsan. Ut vestibulum condimentum tellus in molestie. Mauris luctus enim nec ipsum pretium quis suscipit nisi volutpat. Fusce non nisl quis sem dignissim cursus sit amet ut lectus. Donec nec dolor vel turpis accumsan blandit dapibus non metus. Aenean cursus rutrum fringilla. Proin sit amet purus nec mauris bibendum malesuada. Cras in fringilla mauris. Aliquam volutpat facilisis elit vitae interdum. Phasellus eget ligula enim. Pellentesque vehicula cursus sem vitae dapibus.

Asennus

IMG:

joku.jpg | jokuta.jpg

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" lang="fi" xml:lang="fi"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Lailailailaa!</title> <link href="kukkainen.css" type="text/css" rel="stylesheet" /> </head> <body> <a name="main"></a> <div id="kuva"></div> <div id="linkit"> <a href="#">Linkki</a> <a href="#">Linkki</a> <a href="#">Linkki</a> <a href="#">Linkki</a> <a href="#">Linkki</a> </div> <div id="tekstit"> <h1>S I T E ' S - N A M E</h1> <h2>Lailailailaa!!!</h2> <p> <a href="#">Lorem</a> ipsum dolor sit amet, consectetur adipiscing elit. Sed vitae gravida urna. Pellentesque id lorem et magna fringilla porttitor tristique nec velit. Curabitur vel tortor mattis urna dictum ultricies. Cras a feugiat tortor. In pretium, enim sit amet vehicula dictum, mi quam commodo turpis, sed pharetra enim purus vel augue. Mauris ut arcu nulla. Pellentesque sit amet iaculis sem. Etiam mattis adipiscing accumsan. Ut vestibulum condimentum tellus in molestie. Mauris luctus enim nec ipsum pretium quis suscipit nisi volutpat. Fusce non nisl quis sem dignissim cursus sit amet ut lectus. Donec nec dolor vel turpis accumsan blandit dapibus non metus. Aenean cursus rutrum fringilla. Proin sit amet purus nec mauris bibendum malesuada. Cras in fringilla mauris. Aliquam volutpat facilisis elit vitae interdum. Phasellus eget ligula enim. Pellentesque vehicula cursus sem vitae dapibus. </p> <div class="copyt"> Layout ©<a href="http://tierran.net/dewymorning">Namuless</a> Brush ©<a href="http://aethereality.net/">Aethereality.net</a> <br /> [ <a href="#main">Top</a> ] </div> </div> </body> </html>

CSS:

Name your CSS-folder kukkainen.css.

body { background: url('jokuta.jpg') repeat-y 0px 0px #000000; color: #FFFFFF; font-family: arial, sans-serif; font-size: 12px; text-align: justify; } A:link, A:visited { color: #76DA3A; text-decoration: none; cursor: default; } A:hover { color: #265664; cursor: pointer; } h1 { color: #76DA3A; font-size: 28px; font-family: 'palatino linotype'; font-weight: normal; text-align: center; } h2 { color: #CCCCCC; font-size: 18px; font-family: 'palatino linotype'; font-weight: normal; text-align: center; } #kuva { position:absolute; top: 0; left: 0px; background: url(joku.jpg); width: 800px; height: 500px; } #linkit { position: absolute; top: 100px; left: 800px; width: 160px; text-align: center; } #linkit a:link { display: block; background: #1B2024; border: 1px solid #549ABC; margin-bottom: 2px; padding: 2px; color: #549ABC; font-family: Garamond, Serif; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; } #linkit a:visited { display: block; background: #1B2024; border: 1px solid #549ABC; margin-bottom: 2px; padding: 2px; color: #549ABC; font-family: Garamond, Serif; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; } #linkit a:hover { text-decoration: none; background: transparent; } #linkit a:hover:before { content: " [ "; color: #76DA3A; font-weight: bold; } #linkit a:hover:after { content: " ] "; color: #76DA3A; font-weight: bold; } #tekstit { position: absolute; top: 10px; left: 140px; width: 600px; padding-bottom: 50px; } #tekstit .copyt { padding-top: 10px; font-size: 10px; text-align: center; } input, select, textarea { background: #1B2024; border: 1px solid #FFF; color: #FFF; font-family: arial, sans-serif; font-size: 12px; padding: 5px; } input:focus, select:focus, textarea:focus { color: #549ABC; }