Mabuk Sang Legenda: November 2007

Kamis, 01 November 2007

colibri: a beautiful template for your blogger

Download

Paper plain yellow

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title><$BlogPageTitle$></title> <$BlogMetaData$> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <style type="text/css"> #g_title p, #g_footer p, #g_description p { margin: 0; } /* -- -- -- -- -- -- -- Browser Fixes -- -- -- -- -- -- -- This file uses CSS filtering methods to fix various layout bugs. Each of the following three imported files is a separate, browser-specific CSS file that keeps all hacks out of the main style sheet. Over time, as supporting these browsers no longer remains a priority, cleaning up the hacks is as easy as deleting the @import statement below, or simply no longer linking this file from the HTML. */ /* fix ie6 "peekaboo bug" using the "holly hack". Note, this style only gets applied to ie6 */ * html .wrapper { height: 0.1%; } /* * IE5 mac - overrides the IE/Win hack */ /*\*//*/ * html #threecolumn div { height: auto; } /**/ /* * IE5/Win-specific CSS -ensures #container wraps all content on window resize */ @media tty { i{content:"\";/*" "*/}} * html #container { height: 1%; } /*";} }/* */ /* Styling for editable elements. Eventually, this will be part of the style. */ .editable { border: 1px dashed blue; } #footer { clear: both; } /* Extra divs hidden by default. The custom CSS can override this though */ #extraDiv1, #extraDiv2, #extraDiv3, #extraDiv4, #extraDiv5, #extraDiv6 { display: none; } a img,:link img,:visited img {border: none;} /* -- -- -- -- -- -- -- 2 Column Layout Left sidebar -- -- -- -- -- -- -- */ /* Center #container, constrain to 718px width ----------------------------------------------- */ body { text-align: center; } #container { width: 718px; text-align: left; margin: 0 auto; } /* Set up the columns ----------------------------------------------- */ #main-content { float: right; width: 470px; overflow: hidden; } #sidebar { float: right; width: 230px; overflow: hidden; } /* Clear the Footer ----------------------------------------------- */ #footer { clear: both; } /** BEGIN CUSTOM SKIN **/ dl,li,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input {margin: 0; padding: 0;} a img,:link img,:visited img {border: none;} address {font-style: normal;} body { font-size: 62.5%; font-family: Georgia, "Times New Roman", Times, serif; line-height: 1.2; } #header, #main-content, #sidebar, #footer { font-size: 1.2em; } h1,h2,h3,h4,h5,h6,pre,code,p { font-weight: normal; } h1,h2,h3,h4,h5,h6 { font-family: "Times New Roman", Times, serif; margin: 0.5em 0; } ul,ol { padding-left: 20px; } * html ul, * html ol { padding-left: 0; } p { text-indent: 1.2em; } h1 { font-size: 3em; font-variant: small-caps; margin: 0 0 0.25em; padding: 0.5em 0 0.25em; } h2 { font-size: 2em; font-style: italic; letter-spacing: -0.03em; padding-bottom: 0.2em; } h3 { font-size: 1.5em; font-variant: small-caps; padding-bottom: 0.3em; } h4 { font-size: 1.25em; font-style: italic; letter-spacing: -0.03em; font-weight: bold; margin: 1em 0 0.8em; } h5 { font-size: 1.25em; font-weight: bold; letter-spacing: -0.03em; margin: 1em 0; } h6 { font-size: 1.25em; font-style: italic; letter-spacing: -0.03em; margin: 1em 0; } input, select, th, td { font-size: 1em; } caption, th { font-weight: bold; } caption { padding: 0.5em; } th,td { padding: 0.5em; } table p { text-indent: 0; } #container { width: 750px; } #header { padding: 0 50px 50px; } #main-content { padding: 0 65px 0 0; margin-bottom: 1em; } #threecolumn #main-content { float:right; width: 360px; padding: 0 15px 0 0; } #twocolumn-right #main-content { width: 405px; padding: 0 20px 0 70px; } #twocolumn-left #main-content { width: 405px; } #onecolumn #main-content { padding: 0 70px 0 68px; } #sidebar, #sidebar-alternate { padding: 0 20px 0 0; margin-bottom: 1em; } #threecolumn #sidebar { float: right; width: 115px; padding: 0 65px 0 0; } #twocolumn-right #sidebar { width: 185px; padding: 0; } #twocolumn-left #sidebar { width: 185px; } #threecolumn #sidebar-alternate { width: 115px; padding: 0 0 0 65px; } #g_description { text-align: right; } #footer hr { visibility: hidden; } #footer { width: 405px; float: right; margin: 1em 65px 1em 0; font-style: italic; } #threecolumn #footer { width: 470px; text-align: center; text-indent: 0; } #twocolumn-right #footer { width: 405px; float: left; margin-left: 65px; } #onecolumn #footer { width: 595px; text-align: center; text-indent: 0; } /* IE6 */ * html #header {margin-left:2px;} * html #threecolumn #sidebar-alternate {margin-left: 0px;} * html #threecolumn #container {padding-left:30px;} * html #twocolumn-right #footer {margin-left: 35px;} * html #twocolumn-left #footer, * html #onecolumn #footer {margin-right: 35px;} body { background: #CFD5E3 url(http://pages.google.com/-/includes/style/paper-legal-pad/images/tile.jpg) top center repeat-y; } body#threecolumn { background: #CFD5E3 url(http://pages.google.com/-/includes/style/paper-legal-pad/images/tile-threecolumn.jpg) top center repeat-y; } body#twocolumn-right { background: #CFD5E3 url(http://pages.google.com/-/includes/style/paper-legal-pad/images/tile-twocolumn-right.jpg) top center repeat-y; } body#onecolumn { background: #CFD5E3 url(http://pages.google.com/-/includes/style/paper-legal-pad/images/tile-onecolumn.jpg) top center repeat-y; } #header, #main-content, #sidebar, #footer { color: #2A3B64; } p,li,dl,td { color: #333; } a:link { color: #0036B3; } a:visited { color: #6900B3; } a:link:hover, a:visited:hover { color: #003F5C; } ul { list-style: url(http://pages.google.com/-/includes/style/paper-legal-pad/images/bullet.gif); } img { padding: 1px; border: 1px solid #CFD5E3; } h1 { background: url(http://pages.google.com/-/includes/style/paper-legal-pad/images/underline-h1.gif) bottom center no-repeat; color: #435682; } h2,h3 { background: url(http://pages.google.com/-/includes/style/paper-legal-pad/images/underline.gif) bottom left no-repeat; } #onecolumn h2, #onecolumn h3 { background: url(http://pages.google.com/-/includes/style/paper-legal-pad/images/underline-onecolumn.gif) bottom center no-repeat; } caption { background: #CFD5E3; } th { border-bottom: 1px solid #CFD5E3; } table { border: 1px solid #CFD5E3; } #header { background: url(http://pages.google.com/-/includes/style/paper-legal-pad/images/header.jpg) bottom center no-repeat; } #threecolumn #header { background: url(http://pages.google.com/-/includes/style/paper-legal-pad/images/header-threecolumn.jpg) bottom center no-repeat; } #twocolumn-right #header { background: url(http://pages.google.com/-/includes/style/paper-legal-pad/images/header-twocolumn-right.jpg) bottom center no-repeat; } #onecolumn #header { background: url(http://pages.google.com/-/includes/style/paper-legal-pad/images/header-onecolumn.jpg) bottom center no-repeat; } #footer { background: url(http://pages.google.com/-/includes/style/paper-legal-pad/images/underline.gif) top center no-repeat; } /** END CUSTOM SKIN **/ </style>  <script> </script> </head> <body id="twocolumn-left"> <div id="container"> <div class="wrapper"> <div id="header"> <div class="wrapper"> <h1 id="page-title"><div id="g_title"><$BlogTitle$></div></h1> <div style="clear: both"></div> <div id="g_description"><$BlogDescription$></div> <div style="clear: both"></div> </div> </div> <div id="main-content"> <div class="wrapper"> <div class="content-item"><div id="g_body"> <Blogger> <BlogDateHeader> <h2 class="date-header"><$BlogDateHeaderDate$></h2> </BlogDateHeader>  <div class="post"><a name="<$BlogItemNumber$>"></a> <BlogItemTitle> <h3 class="post-title"> <BlogItemUrl><a href="<$BlogItemUrl$>" title="external link"></BlogItemUrl> <$BlogItemTitle$> <BlogItemUrl></a></BlogItemUrl> </h3> </BlogItemTitle> <div class="post-body"> <div> <$BlogItemBody$> </div> </div> posted by <$BlogItemAuthorNickname$> @ <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a> <MainOrArchivePage><BlogItemCommentsEnabled> <a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a> </BlogItemCommentsEnabled><BlogItemBacklinksEnabled> <a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a> </BlogItemBacklinksEnabled> </MainOrArchivePage> <$BlogItemControl$> </div>   <ItemPage> <div id="comments"> <BlogItemCommentsEnabled><a name="comments"></a> <h4><$BlogItemCommentCount$> Comments:</h4> <ul> <BlogItemComments> <li id="c<$BlogCommentNumber$>"><a name="c<$BlogCommentNumber$>"></a> At <a href="#c<$BlogCommentNumber$>" title="comment permalink"><$BlogCommentDateTime$></a>, <$BlogCommentAuthor$> said… <div class="comment-body"> <$BlogCommentBody$> <$BlogCommentDeleteIcon$> </div> </li> </BlogItemComments> </ul> <$BlogItemCreate$> </BlogItemCommentsEnabled> <BlogItemBacklinksEnabled> <a name="links"></a><h4>Links to this post:</h4> <dl id="comments-block"> <BlogItemBacklinks> <dt class="comment-title"> <$BlogBacklinkControl$> <a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$> </dt> <dd class="comment-body"><$BlogBacklinkSnippet$> posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$> </dd> </BlogItemBacklinks> </dl> <$BlogItemBacklinkCreate$> </BlogItemBacklinksEnabled> <a href="<$BlogURL$>"><< Home</a> </div> </ItemPage>  </Blogger> <center> <center> </center></center></div></div> <div style="clear: both"></div> </div> </div> <div id="sidebar"> <div class="wrapper"> <div class="links"> <div class="wrapper"><div id="g_sidebar"> <$BlogMemberProfile$> <h3>Previous posts</h3> <ul> <BloggerPreviousItems><li><a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a></li></BloggerPreviousItems> </ul> <h3>Archives</h3> <ul> <BloggerArchives> <li><a href='<$BlogArchiveURL$>'><$BlogArchiveName$></a></li> </BloggerArchives> </ul> <h3>Links</h3> <a href="http://freeblogspottemplates.blogspot.com">Free BlogSpot Templates</a> <h3>Credits</h3> <a href="http://freeblogspottemplates.blogspot.com/" target="_blank" alt="Free BlogSpot Templates"><img src="http://photos1.blogger.com/blogger/2848/600/320/FBsT88x31.png" border="0" ></a> <a href="http://www.blogger.com"><img src="http://buttons.blogger.com/bloggerbutton1.gif" alt="Powered by Blogger" /></a> </div></div> <div style="clear: both"></div> </div> </div> </div> <div id="footer"><div class="wrapper"> <hr> <div id="g_footer"><a href="<$BlogUrl$>"><$BlogTitle$></a></div> <div style="clear: both"></div> </div></div> </div> </div> <div id="extraDiv1"></div><div id="extraDiv2"></div> <div id="extraDiv3"></div><div id="extraDiv4"></div> <div id="extraDiv5"></div><div id="extraDiv6"></div> </body> </html> 

Another imageless template

 <!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" xml:lang="en" lang="en"> <head> <title><$BlogPageTitle$></title> <$BlogMetaData$> <style type="text/css"> body{ padding:0; margin:0; font:76% verdana,tahoma,sans-serif; background:#cccccc url(bodybg.gif) repeat; color:#303030; } a{ text-decoration:none; background-color:inherit; color:#286ea0; } a:hover{ background-color:inherit; color:#303030; } h1{ margin:0; font-size:3.6em; letter-spacing:-3px; text-align:right; background-color:inherit; color:#505050; font-variant: small-caps; } h2{ margin:5px 0 10px 0; font-size:1.6em; letter-spacing:-1px; font-weight:normal; } p{ margin:0 0 0px 0; line-height:1.3em; } img{ float:right; margin:0 10px 8px 0; border: 0; } #title{ margin:20px auto -9px auto; width:700px; } #container{ margin:0 auto 15px auto; width:700px; padding:10px; background:#ffffff url(http://photos1.blogger.com/blogger/7994/1253/1600/front.png) bottom left no-repeat; color:#303030; border:20px solid #505050; } #sidebar{ float:left; width:190px; padding-left:10px; text-align: right; } #main{ width:450px; float:right; margin-right: 10px; text-align: justify; } #footer{ clear:both; text-align: center; } .menu{ display:block; width:190px; padding:4px 2px 4px 10px; font-size:1.1em; font-weight:bold; background-color:inherit; color:#286ea0; border:1px solid #ffffff; } .menu:hover{ background-color:#f8f8f8; color:#286ea0; border:1px solid #dadada; } .credits{ margin-bottom:0; font-size:0.8em; background-color:inherit; color:#aaaaaa; } .credits a{ background-color:inherit; color:#aaaaaa; } .small{ font-size:0.8em; } .center{ text-align:right; } blockquote{ margin:20px 0; padding:0 20px 0 50px; background:url('http://photos1.blogger.com/blogger/7994/1253/1600/quote.jpg') 10px top no-repeat; border:none; color: #999999; } </style> </head> <noembed> <body> </noembed> <div id="title"><h1><$BlogTitle$></h1></div> <div id="container"> <div id="sidebar"> <h2>About me</h2> I'm <$BlogOwnerNickname$> From <$BlogOwnerLocation$> <$BlogOwnerAboutMe$> <a href="<$BlogOwnerProfileUrl$>">My profile</a> <h2>Previous Posts</h2> <BloggerPreviousItems> <a class="menu" href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a> </BloggerPreviousItems> <h2>Archives</h2> <BloggerArchives> <a class="menu" href="<$BlogArchiveURL$>"><$BlogArchiveName$></a> </BloggerArchives> <h2>Blog Rolling</h2> <script language="javascript" type="text/javascript" src="http://rpc.blogrolling.com/display.php?r=072265a4faf21710534f0760cd2797f1"></script> <h2>Meta</h2> <ul class="menublock"> This blog is best viewed with Firefox <script type="text/javascript"></script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> <script type="text/javascript"></script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> <a href="http://www.blogger.com"><img src="http://buttons.blogger.com/bloggerbutton1.gif" alt="Powered by Blogger" /></a> <a href="http://freeblogspottemplates.blogspot.com/" target="_blank" alt="Free BlogSpot Templates"><img src="http://photos1.blogger.com/blogger/2848/600/320/FBsT88x31.png" border="0" ></a> </div> <div id="main">  <Blogger> <BlogItemTitle> <h2> <a href="<$BlogItemPermalinkURL$>"><$BlogItemTitle$></a> <BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> </h2> </BlogItemTitle>  <a name="<$BlogItemNumber$>"></a> <$BlogItemBody$> posted by <$BlogItemAuthorNickname$> @ <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a>, <MainOrArchivePage><BlogItemCommentsEnabled><a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>> <script type="text/javascript">var a = <$BlogItemCommentCount$>; if(a == 0) {document.write('No comment');} else if(a == 1){document.write('1 comment');} else {document.write(a+' comments');}</script></a>, </BlogItemCommentsEnabled><BlogItemBacklinksEnabled><a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a> </BlogItemBacklinksEnabled> </MainOrArchivePage><$BlogItemControl$>   <ItemPage> <BlogItemCommentsEnabled><a name="comments"></a> <h3><$BlogItemCommentCount$> Comments:</h3> <dl> <BlogItemComments> <dt id="c<$BlogCommentNumber$>"><a name="c<$BlogCommentNumber$>"></a> At <a href="#c<$BlogCommentNumber$>" title="comment permalink"><$BlogCommentDateTime$></a>, <$BlogCommentAuthor$> said... </dt> <dd> <$BlogCommentBody$> <$BlogCommentDeleteIcon$> </dd> </BlogItemComments> </dl> <$BlogItemCreate$> </BlogItemCommentsEnabled> <BlogItemBacklinksEnabled> <a name="links"></a><h4>Links to this post:</h4> <dl id="comments-block"> <BlogItemBacklinks> <dt class="comment-title"> <$BlogBacklinkControl$> <a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$> </dt> <dd class="comment-body"><$BlogBacklinkSnippet$> posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$> </dd> </BlogItemBacklinks> </dl> <$BlogItemBacklinkCreate$> </BlogItemBacklinksEnabled> <a href="<$BlogURL$>"><< Home</a> </ItemPage> </blogger>  </div> <div id="footer"> <a href="<$BlogURL$>" title="<$BlogTitle$>"><$BlogTitle$></a> </div> </div> </body> </html>