<html> <head> <title>YOUR SITE TITLE HERE!</title> <style type="text/css"> body { background-color: #357AE1; background-repeat: repeat-none; font-family: arial, helvetica, sans-serif; font-size: 12px; color: #000000; margin: 0px; padding: 0px; scrollbar-face-color : #0F16F1; scrollbar-highlight-color : #FFFFFF; scrollbar-3dlight-color : #0F16F1; scrollbar-shadow-color : #354AE1; scrollbar-darkshadow-color : #354AE1; scrollbar-track-color : #354AE1; scrollbar-arrow-color : #354AE1;} a:link, a:active, a:visited {text-decoration: none; color: #0F16F1; font-size: 14px;} a:hover {text-decoration: none; color: #FFFFFF; font-size: 14px;} .head {color:#FFFFFF; font-size:8pt; font-weight:bold; padding-left:2px; background-color: #354AE1; display:block; text-transform:lowercase; width:100%;} h1 {color:#FFFFFF; font-size:8pt; font-weight:bold; padding-left:2px; background-color: #354AE1; display:block; text-transform:lowercase; width:700px;} b {color:#354AE1;} i {color:#354AE1;border-bottom:1px;} u{color:#354AE1; #ffffff dotted} textarea{color:#000000;background:#ffffff;arrow:#ffffff;border:1px dotted #ffffff;font-family:arial, sans-serif; font-size:11px;} </style> </head> <body> <div align="center"> <center> <table border="1" cellspacing="0" width="1000" id="AutoNumber1" bordercolor="#000000" style="border-collapse: collapse" cellpadding="0"> <tr> <td width="150" rowspan="2" valign="top" bgcolor="#FFFFFF"> <p align="center"> <p class="head">NAVIGATION</p> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <p class="head">NAVIGATION</p> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <p class="head">NAVIGATION</p> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <p class="head">NAVIGATION</p> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <p><P>Layout by <a href="http://crazedgraphix.co.nr/" target="_Blank">CG</a>! </P> </td> <td width="650" align="center" valign="top" bordercolor="#000000" bgcolor="#FFFFFF"> <img src="http://usera.imagecave.com/crazedgraphix/banner.jpg" width="700" height="300"></td> <td width="150" rowspan="2" valign="top" bgcolor="#FFFFFF"> <p align="center"><p class="head">NAVIGATION</p> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <p class="head">NAVIGATION</p> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <p class="head">NAVIGATION</p> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <p class="head">NAVIGATION</p> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <P><P>Layout by <a href="http://crazedgraphix.co.nr/" target="_Blank">CG</a>! </td> </tr> <tr> <td width="650" valign="top" bgcolor="#FFFFFF"> <p align="center"><center><b>BOLD</b><i>ITALIC</i><u>UNDERLINE</u> <h1>And LOOK! Teesh has been SO STUPID!</h1> She forgot the Credit, XD! So please credit CG if you use the banner and/or layout. This is Teesh's THIRD layout, pretty spiffeh, do you say? The rules is the same as always, keep the credit on, don't steal or redistibute, blah, blah, blah... <h1>About the Layout</h1> Now this is a tables layout! Lucky for you Teesh included iframes. ;D You can edit the banner, text, links, whatever as long as you do not alter the code or redistribute it. Yup and thats it! Any questions or whatever e-mail Teesh at teeshrox[@]yahoo.com. Enjoy! Oh and to make a main header use < h1 >TEXT < / h1 > without spaces! And for the side header Just C&P! NOW enjoy! </center> </td> </tr> </table> </center> </div> <!-- --><script type="text/javascript" src="http://static.websimages.com/static/global/js/webs/usersites/escort.js"></script><script type="text/javascript">if(typeof(urchinTracker)=='function'){_uacct="UA-230305-2";_udn="none";_uff=false;urchinTracker();}</script></body> </html>
Starry Poogle and Gnorbu Layout, exactly the same as the one above, except for only one nav bar, on the left:
<html> <head> <title>YOUR SITE TITLE HERE!</title> <style type="text/css"> body { background-color: #357AE1; background-repeat: repeat-none; font-family: arial, helvetica, sans-serif; font-size: 12px; color: #000000; margin: 0px; padding: 0px; scrollbar-face-color : #0F16F1; scrollbar-highlight-color : #FFFFFF; scrollbar-3dlight-color : #0F16F1; scrollbar-shadow-color : #354AE1; scrollbar-darkshadow-color : #354AE1; scrollbar-track-color : #354AE1; scrollbar-arrow-color : #354AE1;} a:link, a:active, a:visited {text-decoration: none; color: #0F16F1; font-size: 14px;} a:hover {text-decoration: none; color: #FFFFFF; font-size: 14px;} .head {color:#FFFFFF; font-size:8pt; font-weight:bold; padding-left:2px; background-color: #354AE1; display:block; text-transform:lowercase; width:100%;} h1 {color:#FFFFFF; font-size:8pt; font-weight:bold; padding-left:2px; background-color: #354AE1; display:block; text-transform:lowercase; width:700px;} b {color:#354AE1;} i {color:#354AE1;border-bottom:1px;} u{color:#354AE1; #ffffff dotted} textarea{color:#000000;background:#ffffff;arrow:#ffffff;border:1px dotted #ffffff;font-family:arial, sans-serif; font-size:11px;} </style> </head> <body> <div align="center"> <center> <table border="1" cellspacing="0" width="800" id="AutoNumber1" bordercolor="#000000" style="border-collapse: collapse" cellpadding="0"> <tr> <td width="130" rowspan="2" valign="top" bgcolor="#FFFFFF"> <p align="center"> <p class="head">NAVIGATION</p> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <p class="head">NAVIGATION</p> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <p class="head">NAVIGATION</p> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <p class="head">NAVIGATION</p> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <a href="#" target="iframe">LINK</a><br> <p><P>Layout by <a href="http://crazedgraphix.co.nr/" target="_Blank">CG</a>! </td> <td width="700" align="center" valign="top" bordercolor="#000000" bgcolor="#FFFFFF"> <img src="http://usera.imagecave.com/crazedgraphix/banner.jpg" width="700" height="300"></td> </tr> <tr> <td width=700" valign="top" bgcolor="#FFFFFF"> <p align="center"><center><b>BOLD</b><i>ITALIC</i><u>UNDERLINE</u> <h1>And LOOK! Teesh has been SO STUPID!</h1> She forgot the Credit, XD! So please credit CG if you use the banner and/or layout. This is Teesh's THIRD layout, pretty spiffeh, do you say? The rules is the same as always, keep the credit on, don't steal or redistibute, blah, blah, blah... <h1>About the Layout</h1> Now this is a tables layout! Lucky for you Teesh included iframes. ;D You can edit the banner, text, links, whatever as long as you do not alter the code or redistribute it. Yup and thats it! Any questions or whatever e-mail Teesh at teeshrox[@]yahoo.com. Enjoy! Oh and to make a main header use < h1 >TEXT < / h1 > without spaces! And for the side header Just C&P! NOW enjoy! <h1>Copy</h1> This is excactly the same layout except it has only one nav bar, on the left. XD </center> </td> </tr> </table> </center> </div> <!-- --><script type="text/javascript" src="/i.js"></script><script type="text/javascript">if(typeof(urchinTracker)=='function'){_uacct="UA-230305-2";_udn="freewebs.com";_uff=false;urchinTracker();}</script><!-- --><script type="text/javascript" src="http://static.websimages.com/static/global/js/webs/usersites/escort.js"></script><script type="text/javascript">if(typeof(urchinTracker)=='function'){_uacct="UA-230305-2";_udn="none";_uff=false;urchinTracker();}</script></body> </html>
Mary Kate and Olsen Gray Vintage-Style Layout <style type="text/css"> BODY { font-family: Georgia; font-size:7pt; background-color: white; color: black; text-align: center; bordercolor:white } h3 { color :#c2beb3; background-color: #c2beb3; font-size: 7pt; letter-spacing:2px; text-transform:lowercase; font-weight: normal; margin-bottom:0px; padding:0px; margin:0px; width: 100%; } h2 { color :black; background-color:#ada695; font-size: 7pt; letter-spacing:1px; text-align: center; font-family: arial; text-transform:lowercase; font-weight: normal; margin-bottom:0px; padding:0px; margin:0px; width: 100%; } a.nav:link, a.nav:visited, a.nav:active { color: black; background-color:black; font-size: 7pt; text-align: center; font-family: arial; text-transform:lowercase; margin-bottom:0px; padding:0px; margin:0px; width: 100%; } </style> <style>td,p,body,a:link,a:visited{color: black ;font:7pt georgia;letter-spacing:1px;line-height:13px} a:hover{color:white;background: white;font-size:6pt;text-transform:uppercase;font-weight:bold;letter-spacing:0;cursor: default} </style> <style> body {scrollbar-face-color:#c2beb3; scrollbar-shadow-color:#c2beb3; scrollbar-highlight-color:#c2beb3; scrollbar-3dlight-color:#c2beb3; scrollbar-darkshadow-color:#c2beb3; scrollbar-track-color:#c2beb3; scrollbar-arrow-color:white } /*tdr*/ </style> <body style="background-color: #c2beb3;"> <div style="position: absolute; top: 0px; left: 0px;"> <IMG SRC='http://i138.photobucket.com/albums/q259/haley_baby1994/Elegancemainpic.jpg' border=0> </div> <div style="position:absolute;background-color:white; left:70px; top:460px; width:400px"> <h2>Welcome</h2> Welcome messege here! </div> </div> <div style="position:absolute;background-color:white; left:500px; top:460px; width:152px"> <h2>Taxi</h2> <a href="Neopets.com">link</a><br> <a href="neopets.com">link</a><br> <a href="Neopets.com">link</a><br> <a href="neopets.com">link</a><br> <h3>.</h3> <h2>Affiliates</h2> Put your affiliates here! <h3>.</h3> <h2>header</h2> <center> TEXT TEXT TEXT TEXT TEXT </center> <h3>.</h3> <h2>Credit</h2> <a href="http://crazedgraphix.co.nr/" target="_blank"><img src="http://i250.photobucket.com/albums/gg261/Erased-Neo/CrazedGraphixButton.gif" border="0"></a> </div>
Purple Table Dropdown Layout <html> <head> <title> YOUR SITES NAME HERE </title> <style type="text/css"> /*Credits: Dynamic Drive CSS Library */ /*URL: http://www.dynamicdrive.com/style/ */ .suckertreemenu ul{ margin: 0; padding: 0; list-style-type: none; } /*Top level list items*/ .suckertreemenu ul li{ position: relative; display: inline; float: left; background-color: #F3F3F3; /*overall menu background color*/ } /*Top level menu link items style*/ .suckertreemenu ul li a{ display: block; width: 90px; /*Width of top level menu link items*/ padding: 1px 8px; border: 1px solid black; border-left-width: 0; text-decoration: none; color: navy; } /*1st sub level menu*/ .suckertreemenu ul li ul{ left: 0; position: absolute; top: 1em; /* no need to change, as true value set by script */ display: block; visibility: hidden; } /*Sub level menu list items (undo style from Top level List Items)*/ .suckertreemenu ul li ul li{ display: list-item; float: none; } /*All subsequent sub menu levels offset after 1st level sub menu */ .suckertreemenu ul li ul li ul{ left: 159px; /* no need to change, as true value set by script */ top: 0; } /* Sub level menu links style */ .suckertreemenu ul li ul li a{ display: block; width: 160px; /*width of sub menu levels*/ color: navy; text-decoration: none; padding: 1px 5px; border: 1px solid #ccc; } .suckertreemenu ul li a:hover{ background-color: black; color: white; } /*Background image for top level menu list links */ .suckertreemenu .mainfoldericon{ background: #F3F3F3 url(media/arrow-down.gif) no-repeat center right; } /*Background image for subsequent level menu list links */ .suckertreemenu .subfoldericon{ background: #F3F3F3 url(media/arrow-right.gif) no-repeat center right; } * html p#iepara{ /*For a paragraph (if any) that immediately follows suckertree menu, add 1em top spacing between the two in IE*/ padding-top: 1em; } /* Holly Hack for IE \*/ * html .suckertreemenu ul li { float: left; height: 1%; } * html .suckertreemenu ul li a { height: 1%; } /* End */ </style> <script type="text/javascript"> //SuckerTree Horizontal Menu (Sept 14th, 06) //By Dynamic Drive: http://www.dynamicdrive.com/style/ var menuids=["treemenu1"] //Enter id(s) of SuckerTree UL menus, separated by commas function buildsubmenus_horizontal(){ for (var i=0; i<menuids.length; i++){ var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul") for (var t=0; t<ultags.length; t++){ if (ultags[t].parentNode.parentNode.id==menuids[i]){ //if this is a first level submenu ultags[t].style.top=ultags[t].parentNode.offsetHeight+"px" //dynamically position first level submenus to be height of main menu item ultags[t].parentNode.getElementsByTagName("a")[0].className="mainfoldericon" } else{ //else if this is a sub level menu (ul) ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it ultags[t].parentNode.getElementsByTagName("a")[0].className="subfoldericon" } ultags[t].parentNode.onmouseover=function(){ this.getElementsByTagName("ul")[0].style.visibility="visible" } ultags[t].parentNode.onmouseout=function(){ this.getElementsByTagName("ul")[0].style.visibility="hidden" } } } } if (window.addEventListener) window.addEventListener("load", buildsubmenus_horizontal, false) else if (window.attachEvent) window.attachEvent("onload", buildsubmenus_horizontal) </script> <style type="text/css"> body { background-color: #CC99CC; background-repeat: repeat-none; font-family: arial, helvetica, sans-serif; font-size: 12px; color: #000000; margin: 0px; padding: 0px; scrollbar-face-color : #CC66FF; scrollbar-highlight-color : #CC66FF; scrollbar-3dlight-color : #CC66FF; scrollbar-shadow-color : #CC66FF; scrollbar-darkshadow-color : #CC66FF; scrollbar-track-color : #CC33DD; scrollbar-arrow-color : #FFFFFF;} a:link, a:active, a:visited {text-decoration: none; color: #FFFFFF; font-size: 12px;} a:hover {text-decoration: none; color: #FFFFFF; font-size: 12px;} .head {color:#FFFFFF; font-size:8pt; font-weight:bold; padding-left:2px; background-color: #CC66FF; display:block; text-transform:lowercase; width:1000%;} b {color:#FFFFFF;} i {color:#FFFFFF;border-bottom:1px;} u{color:#FFFFFF; #ffffff dotted} textarea{color:#000000;background:#ffffff;arrow:#ffffff;border:1px dotted #ffffff;font-family:arial, sans-serif; font-size:11px;} </style> </head> <body><img src="http://i252.photobucket.com/albums/hh36/teeshrox/banner-1.jpg"> <div class="suckertreemenu"> <ul id="treemenu1"> <li><a href="#" style="border-left: 1px solid black">Item 1</a></li> <li><a href="#">Item 2</a></li> <li><a href="#">Folder 1</a> <ul> <li><a href="#">Sub Item 1.1</a></li> <li><a href="#">Sub Item 1.2</a></li> <li><a href="#">Sub Item 1.3</a></li> <li><a href="#">Sub Item 1.4</a></li> </ul> </li> <li><a href="#">Item 3</a></li> <li><a href="#">Folder 2</a> <ul> <li><a href="#">Sub Item 2.1</a></li> <li><a href="#">Folder 2.1</a> <ul> <li><a href="#">Sub Item 2.1.1</a></li> <li><a href="#">Sub Item 2.1.2</a></li> <li><a href="#">Sub Item 2.1.3</a></li> <li><a href="#">Sub Item 2.1.4</a></li> </ul> </li> </ul> </a> </li> <li><a href="#">Item 4</a></li> </ul> <br style="clear: left;" /> </div> <TABLE BORDER="1" BORDERCOLOR="FFFFFF" CELLPADDING="0" CELLSPACING="0" WIDTH="540" height="500"> <TR> <TD WIDTH="500" VALIGN="TOP" BGCOLOR="CC99CC"> <p class="head">NEWS</p><br><b>BOLD</b><i>ITALIC</i><u>Underline</u><u>Check our COOL textare effects! I even added dots and scrolbar colors! <p class="head">About the Layouts</p> Thanks for using one of CG's site layouts! Its a purple themed layout. As you know, purple is my FAVOURITE color ;) The banner is cute yet simple. VERY simple. If you want to, you can make it fancy by editing it. You can also insert your site name in the banner. How nice of me! <3This one is made by the super site ownie Teesh! :D Its a tables dropdown layout. We also have a non-dropdown tables layout too if you want. Any problems e-mail Teesh at teeshrox(@)yahoo.com delete the () Have fun! <p class="head">Copyright</p> Yeah, you may edit the coding <b>for personal use only.</b> Please <b>Do not redistribute them!</b> Thieves WILL be found and frozen. You can however, edit the colors or the top image to put your site name in which is 540px wide. Dropdown menu from <a href="http://dynamicdrive.com">Dynamic Drive</a> If you want to, you may edit the dropdown menu colors. I did not adjust them so if you want, you can! <p><P>Site Layout by <a href="Http://crazedgraphix.co.nr/" target="_blank">Crazed Graphix</a> <p class="head">Coding</p> I know this is just another section but I DID NOT include iframes! If you would like them, use our tutorial or e-mail me! If the coding goes wrong, you want to ask permission for something, or you just want to comment, you can post on the site or e-mail me! :) </TD> </TR> </TABLE> <!-- --><script type="text/javascript" src="http://static.websimages.com/static/global/js/webs/usersites/escort.js"></script><script type="text/javascript">if(typeof(urchinTracker)=='function'){_uacct="UA-230305-2";_udn="none";_uff=false;urchinTracker();}</script></body> </html>
