Cherry tree

Otsikko

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec urna tellus, pharetra nec venenatis et, ultricies sed libero. Aenean vehicula tincidunt arcu eu porta. Nulla auctor est et metus venenatis sit amet dictum dui hendrerit. Proin scelerisque augue id odio congue pellentesque. Duis at ligula eget magna dictum condimentum et a tellus. Integer tempus dui at tellus euismod fermentum. Maecenas varius urna quis est fringilla sollicitudin. In luctus venenatis libero non viverra. Maecenas ut metus dui, nec aliquet neque. Mauris consectetur ipsum eu metus pretium sollicitudin. Praesent iaculis congue tellus, eget pellentesque justo tristique sed. Ut bibendum augue ut nibh malesuada blandit. Sed volutpat sem sit amet ipsum elementum rutrum. Aenean faucibus augue a sapien egestas rhoncus. Fusce imperdiet placerat justo eget imperdiet.

Toinen otsikko

Mauris tortor nisl, auctor quis euismod quis, luctus quis neque. Praesent nisi orci, facilisis eget egestas vitae, ultricies sed eros. Donec ac lorem sapien. Cras quis augue velit, vel varius nibh. Mauris purus nibh, volutpat ac euismod et, vestibulum non nibh. Nam sed enim nisi, sit amet congue metus. Nam in risus id purus sollicitudin porttitor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin convallis, dui suscipit facilisis eleifend, turpis neque porta dui, eget vehicula nulla velit nec neque. Sed vitae neque nisl, non ultrices diam.

Nulla aliquet metus eget justo porttitor eu pharetra tortor venenatis. Aenean ut eleifend mi. Proin augue tortor, laoreet at mollis a, ornare nec nisi. Donec pellentesque, nunc non volutpat rutrum, arcu risus commodo neque, quis pretium dui augue in diam. Vivamus lacinia mauris non diam tempor sit amet egestas quam mollis. Praesent ut massa accumsan nulla viverra dapibus. Donec enim purus, posuere at fermentum id, aliquet eget augue. Praesent varius mattis urna, at consectetur augue posuere non. Duis accumsan risus eget mi ullamcorper molestie. In id tellus quis mi porta eleifend. Aliquam erat volutpat.

Asennus

IMG:

95.jpg | dew1.jpg

CSS:

Name your CSS-folder x.css

body { margin: 0; background: #756E26; font-family: Georgia, Serif; font-size: 12px; word-spacing: 2px; text-align: justify; } a:link, a:visited { color: #EEE; } a:hover { text-decoration: none; } h1 { margin: 0; padding: 50px 300px 0px 0px; font-size: 40px; font-style: italic; text-shadow: 1px 1px 10px #756E26; color: #F0DEEA; } h2 { text-align: center; font-size: 20px; font-weight: normal; font-style: italic; color: #F0DEEA; text-shadow: 1px 1px 0px #4B431C; letter-spacing: 2px; border-bottom: 1px dashed #989052; line-height: 3px; } h3 { text-align: center; font-size: 15px; font-weight: normal; font-style: italic; color: #F0DEEA; text-shadow: 1px 1px 0px #4B431C; letter-spacing: 2px; } h4 { padding: 0px 340px 0px 0px; margin: 0; font-style: italic; font-weight: normal; font-size: 14px; color: #F0DEEA; } #tausta { right: 0; width: 100%; height: 294px; background: url('95.jpg') repeat right top; border-bottom: 10px solid #F0DEEA; } #tausta .otsikko { background: url('dew1.jpg') no-repeat right; height: 100%; text-align: right; } #navi { float: left; padding-left: 50px; margin-bottom: 20px; } #navi a:link { background: #F0DEEA; margin: 0px 5px 0 0px; padding: 10px 25px 6px 25px; text-decoration: none; font-style: italic; color: #989052; letter-spacing: 1px; } #navi a:hover { border-bottom: 6px solid #989052; color: #71672A; text-shadow: 1px 1px 0 #FFF; } #teksti { clear:both; float:right; width: 600px; padding: 0 50px 30px 0; color: #F6F4F5; text-align: justify; } #ala { clear:both; width: 100%; border-top: 5px solid #F0DEEA; float: right; text-align: right; padding: 20px 50px 30px 0px; color: #F0DEEA; font-style: italic; background: url(95.jpg) repeat; } input, select, textarea { color: #71672A; border-bottom: 1px solid #F0DEEA; border-left: 7px solid #F0DEEA; border-right: 1px solid #F0DEEA; border-top: 1px solid #F0DEEA; background: #989052; font-family: Tahoma, Sans-serif; font-size: 12px; padding: 10px; }

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="fi" xml:lang="fi"> <head> <title>Cherry tree</title> <link href="cherry.css" type="text/css" rel="stylesheet" /> </head> <body> <div id="tausta"> <div class="otsikko"> <h1>Site Title</h1> <h4>versio 0.0</h4> </div> </div> <div id="navi"> <a href="#">Linkki</a> <a href="#">Linkki</a> <a href="#">Linkki</a> <a href="#">Linkki</a> <a href="#">Linkki</a> </div> <div id="teksti"> <h2>Otsikko</h2> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec urna tellus, pharetra nec venenatis et, ultricies sed libero. Aenean vehicula tincidunt arcu eu porta. Nulla auctor est et metus venenatis sit amet dictum dui hendrerit. Proin scelerisque augue id odio congue pellentesque. Duis at ligula eget magna dictum condimentum et a tellus. Integer tempus dui at tellus euismod fermentum. Maecenas varius urna quis est fringilla sollicitudin. In luctus venenatis libero non viverra. Maecenas ut metus dui, nec aliquet neque. Mauris consectetur ipsum eu metus pretium sollicitudin. Praesent iaculis congue tellus, eget pellentesque justo tristique sed. Ut bibendum augue ut nibh malesuada blandit. Sed volutpat sem sit amet ipsum elementum rutrum. Aenean faucibus augue a sapien egestas rhoncus. Fusce imperdiet placerat justo eget imperdiet.</p> <h3>Toinen otsikko</h3> <p>Mauris tortor nisl, auctor quis euismod quis, luctus quis neque. Praesent nisi orci, facilisis eget egestas vitae, ultricies sed eros. Donec ac lorem sapien. Cras quis augue velit, vel varius nibh. Mauris purus nibh, volutpat ac euismod et, vestibulum non nibh. Nam sed enim nisi, sit amet congue metus. Nam in risus id purus sollicitudin porttitor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin convallis, dui suscipit facilisis eleifend, turpis neque porta dui, eget vehicula nulla velit nec neque. Sed vitae neque nisl, non ultrices diam.</p> <p>Nulla aliquet metus eget justo porttitor eu pharetra tortor venenatis. Aenean ut eleifend mi. Proin augue tortor, laoreet at mollis a, ornare nec nisi. Donec pellentesque, nunc non volutpat rutrum, arcu risus commodo neque, quis pretium dui augue in diam. Vivamus lacinia mauris non diam tempor sit amet egestas quam mollis. Praesent ut massa accumsan nulla viverra dapibus. Donec enim purus, posuere at fermentum id, aliquet eget augue. Praesent varius mattis urna, at consectetur augue posuere non. Duis accumsan risus eget mi ullamcorper molestie. In id tellus quis mi porta eleifend. Aliquam erat volutpat. </p> <div id="ala"> Layout ©<a href="http://tierran.net/dewymorning/">Namuless</a> Image ©<a href="http://www.flickr.com/photos/essjay/">EssjayNZ</a> <a href="http://creativecommons.org/licenses/by-nc-sa/2.0/deed.en">(license)</a> Pattern ©<a href="http://shizoo.frozen-media.de">shizoo</a> </div> </body> </html>