alphaska - Google官方博客样式的制作方法

<html><head><title><$BlogPageTitle$></title>
<style>

#b-navbar {
   height:0px;
   visibility:hidden;
   display:none

}/*隐藏顶部导航栏的代码 */
body{margin:0px 0px 0px 0px;font-family:trebuchet ms, verdana, sans-serif;background-color:white;}
#Title{font-size:63px;padding-left:15px;padding-top:10px;text-transform:uppercase;

font-family:trebuchet ms, verdana, sans-serif;}
#Title a {text-decoration:none;color:inherit;}
#Description{padding:0px;padding-top:10px;font-size:12px;font-weight:normal}
.DateHeader{border-bottom:none;font-size:15px;text-align:left;margin-top:20px;

margin-bottom:14px;padding:1px;padding-left:17px;color:gray;font-family:trebuchet ms, verdana, sans-serif;}
.PostTitle{font-size:15px;font-weight:bold;color:4aa0e0;}
.Post{font-size:12px;padding-left:20px;margin-bottom:20px;padding-right:20px;line-height:22px}
.PostFooter{margin-bottom:15px;margin-left:0px;color:black;font-size:10px}
.comment-link {margin-left:.6em;}
@media all {
#leftcontent{background-color:#ffffff;border-right:1px dashed #ccc;border-bottom:0px dashed #ccc;float:left;padding-bottom:20px;margin-right:15px;padding:0px;width:67%;border-top:0px dashed #ccc}
}/*右侧Blog竖线的CSS样式*/

@media handheld {
#leftcontent{border-right:0px dashed #ccc;float:none;margin:0 5% 0 5%;width:90%;}
}
.line{border-right:0px dashed #ccc;border-bottom:1px dashed #ccc;float:left;width:100%;border-top:0px dashed #ccc}
.SideBarTitle{font-weight:bold;font-size:18px;color:green;}
h1{font-size:14px;padding-top:10px}
a{text-decoration:none}
a:hover{border-bottom:none;}
@media all {
#rightcontent{font-size:12px;height:100%;margin-left:0px;text-transform:none;

padding-right:10px;background-color:white;}
}
@media handheld {
#rightcontent{margin:0 5% 0 5%;}
}

.blogComments{font-size:15px;text-align:left;margin-top:20px;margin-bottom:14px;padding:1px;padding-left:17px;color:gray;font-family:trebuchet ms, verdana, sans-serif;}
.blogComment{margin-top:10px;margin-bottom:10px;color:black;text-indent:10px;padding-right:20px;line-height:22px}
.deleted-comment {font-style:italic;color:gray;}
.byline{margin-bottom:20px;margin-left:0px;margin-right:10px;color:black;font-size:10px;display:inline}
#profile-container { }
.profile-datablock { }
.profile-img {display:inline;}
.profile-img img {float:left;margin:0 10px 0px 0;border:4px solid #ccc;}
#profile-container p { }
#profile-container .profile-textblock { }
.profile-data strong {display:block;}
</style>


<$BlogMetaData$>
</head><body>

<div id="leftcontent">
    <div id="Title">
    <ItemPage><a href="<$BlogURL$>"></ItemPage>
    <img src="http://msig.info/web2v2/(reflect)WormCaiBETA.png">
    <ItemPage></a></ItemPage>

</div>

<Blogger>

<BlogDateHeader>
<div class="DateHeader"><$BlogDateHeaderDate$></div>
</BlogDateHeader>

<div class="Post"><a name="<$BlogItemNumber$>"> </a>

<BlogItemTitle>
<span class="PostTitle"><BlogItemURL><a href="<$BlogItemURL$>"></BlogItemURL>
<$BlogItemTitle$><BlogItemURL></a></BlogItemURL></span>
</BlogItemTitle>
<$BlogItemBody$>


<span class="PostFooter">
¶<a href="<$BlogItemPermalinkURL$>" title="permanent link"><$BlogItemDateTime$></a><MainOrArchivePage><BlogItemCommentsEnabled> <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>>

<$BlogItemCommentCount$> comments</a></BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a>
</BlogItemBacklinksEnabled>
</MainOrArchivePage><$BlogItemControl$></span>
<div class="line"></div>
</div>

<ItemPage>
<div class="blogComments">
    <BlogItemCommentsEnabled><a name="comments"></a>
            Comments:
            <BlogItemComments>
            <div class="blogComment">
                <a name="<$BlogCommentNumber$>"></a>                 <$BlogCommentBody$><br />
                <div class="byline"><a href="<$BlogCommentPermalinkURL$>" title="permanent link">#</a> posted by <$BlogCommentAuthor$> : <$BlogCommentDateTime$></div>

                <$BlogCommentDeleteIcon$>
            </div>
            </BlogItemComments>
            <$BlogItemCreate$>
    </BlogItemCommentsEnabled>
        <br /> <br />
        <BlogItemBacklinksEnabled>
        <a name="links"></a>
        Links to this post:
        <BlogItemBacklinks>
            <div class="blogComment">
            <a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a>
            <$BlogBacklinkDeleteIcon$>
            <br />
            <$BlogBacklinkSnippet$><br />
            <div class="byline">
            <span class="comment-poster">
            <em>posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$></em>
            </span>
            </div>
            </div>
        </BlogItemBacklinks>
        <p class="comment-timestamp"><$BlogItemBacklinkCreate$></p>
        </BlogItemBacklinksEnabled>

    <br /> <br />
    <a href="<$BlogURL$>"><< Home</a>
    </div>

</ItemPage>
</Blogger>

</div>

<div id="rightcontent">

    <div id="Description"><$BlogDescription$></div>

    <p>

<div id="profile-container">
<h1 class="SideBarTitle">ARCHIVES</h1>

<BloggerArchives>
    <a href="<$BlogArchiveURL$>"><$BlogArchiveName$></a> /
</BloggerArchives>
<script type="text/javascript" language="Javascript">if (location.href.indexOf("archive")!=-1) document.write("<strong><a href=\"<$BlogURL$>\">Current Posts</a></strong>");</script>

    <br /></p>

    <br />
<p style="text-align:center">

<a href="http://www.blogger.com"><img alt="Powered by Blogger" border=0 src="http://buttons.blogger.com/bloggerbutton1.gif"></a>
</p>

</div>

</body>
</html>