我的知己在街头

在元宵节第二天的新BLOG样式烫手出炉之前，这里的页面已经裸奔有一个来月了好像，别人看着特别毛糙，自己看着也不入眼。并不是在搞Css Naked Day，只不过一方面最初的“春色满园”已经重炒一次冷饭还都好久了，实在不好意思吃老本；另一方面因为时间和精力的原因，一直没有腾得出手来再做一个，所以裸奔就裸奔吧，比起甘于原地踏步要强。

还记得上次的“Love Is In The Air”也是元宵节改的版，见元宵快乐，blog样式改版，这次的样式，又成为了元宵节献礼工程，名字就叫“Moonshine In My Eyes”吧。是借鉴自blog世界尽头的卡夫卡的主题，为防止原主人Shingudoo骂我剽窃，我得把Shingudoo夸两句先:D

Shingudoo在大连，是自由插画作者，在deviantART有一个作品集。喜欢日本作家村上春树的作品，喜欢海边，爱好看鬼片、动画片，兴趣是画画，搞些创作，从画风以及文风看，个人猜测其是女孩，我目前就只八卦到这些。

瞧这效果图，并非我眼神不慎有视觉残留，只不过一直取Stratovarius乐队<<forever>>中的一句歌词“Sunshine in my eyes”觉得挺有意象，适逢这次改版的风格，叫“Moonshine In My Eyes”，瞅瞅，清辉入眼，不觉着很贴切么。

不过由于用得不是同一套blog系统，所以样式迁移还是花了些时间的。为了省事也好，说是对.Text的模板系统有所不满也好（纯CSS定制程度不高），这次首先我就脚本中来了一句：

document.getElementById("MainStyle").disabled = true;

把现有模板的默认样式禁掉了。

为了能尽量贴近原有设计，又用脚本往网页DOM树加入新Element以应用额外的样式。即便如此，还是无法原封不动地照原本临摹下来，有着这样那样的bug，还有IE下和Fire Fox下显示有差异的老问题，先不管了，意思尽到就行了。要真原封不动地照搬过来，那可不就成了抄袭了么？你休想challenge我现在这行为叫什么，其实回答你也没关系，这叫创新你懂没？

为了给没懂抄袭和创新区别的同学普及一下常识，我这里最后就讲个关于应用抄袭和创新的场景吧：

别人卷子上答案是 b/q
你也写 b/q
这叫抄袭
你写成 B/Q
这叫模仿　
你看花眼写成 6/9
这叫借鉴
你自作聪明化简成 2/3
这就叫创新...

* {
    margin: 0;
    padding: 0;
    border: none;
    list-style: none;
}
body {
    font-family: Arial, Verdana, Helvetica, sans-serif;
    text-align: center;
    line-height: 160%;
    color: #BBB;
    font-size: 75%;
    background: #2D2B2C url(http://blog.run2me.com/images/run2me_com/geniusleft/108/o_moon_back.jpg) left top repeat-x;
    /* TODO: by hujian */
    width: 818px;
    margin: 0 auto;    
}
li {
}
a {
    color: #B0DCF0;
    text-decoration: underline;
}
a:visited
{
     color: #B0DCF0;
    text-decoration: none;
}

a:active
{
    color: #B0DCF0;
    text-decoration: underline;
}

a:link
{    
    color: #B0DCF0;
    text-decoration: underline;
}
a:hover {
    color: #A0E646;
    text-decoration: underline;
}
img {
    border: none;
}
input {
    padding: 1px;
    font-size: 100%;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    color: #BBB;
    border: 1px solid #3A3C3F;
    background: none;
}
textarea {
    padding: 2px 3px;
    font-size: 100%;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    color: #BBB;
    border: 1px solid #3A3C3F;
    background: none;
    overflow: auto;
}
.commentTextBox {
    width: 48px;
    height: 19px;
    padding: 0 0 2px 7px;
    *padding: 2px 0 2px 3px;
    font-size: 100%;
    font-weight: bold;
    letter-spacing: 0.5em;
    text-align: center;
    color: #BBB;
    border: 1px solid #3A3C3F;
    background: #221C1C;
    cursor: pointer;
}
#top
{
    padding-top:220px;    
    font-size: 100%;
    background: url(http://blog.run2me.com/images/run2me_com/geniusleft/108/o_container.jpg) center top no-repeat;
    overflow: hidden;
    text-align: center;
}
#top a {
    color: #BBB;
}
#top a:hover {
    color: #B0DCF0;
    text-decoration: none;
}
.headermaintitle {
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    line-height: 100%;
    color: #BBB;
    word-break: break-all;
    overflow:hidden;
}
#tagline {
    margin: 0 40px 23px 40px;
    padding-bottom: 5px;
    font-size: 120%;
    line-height: 140%;
    color: #BBB;
    word-break: break-all;
    overflow:hidden;
}
#main {
    width: 587px;
    margin-top: 5px;
    text-align: left;
    line-height: 165%;
}
div.post {
    width: 587px;
    padding: 0 30px 0 0;
    line-height: 170%;
    background: url(http://blog.run2me.com//images/run2me_com/geniusleft/108/o_post_back.jpg) left top repeat-y;
}
.date {
    width: 587px;
    margin-bottom: 0px;
    margin-left:24px;
    text-align: left;
    
    z-index:999;    
}
div.post h2 {
    background: url(http://blog.run2me.com//images/run2me_com/geniusleft/108/o_post_header.jpg) left top no-repeat;
    height:89px;
    width:587px;
    margin-left:0;
    margin-bottom : 10px;
    padding: 60px 0px 10px 30px;
    font-size: 120%;
    font-weight: bold;
    text-align: left;
    line-height: 120%;
    color: #B0DCF0;
    overflow: hidden;
    word-break: break-all;
}
div.post h2 a {
    color: #B0DCF0;
    text-decoration: underline;
}
div.post h2 a:hover {
    color: #A0E646;
    text-decoration: underline;
}
div.post p {
    margin: 0 0 15px 30px;
    text-indent: 2em;
}
div.post blockquote {
    margin: 0 45px 15px 45px;
    padding: 1em;
    background:#BBB;
    color:#333;
}
div.post blockquote a{
    color:#363;
    text-decoration:underline;
}
div.post blockquote a:hover
{
    padding-top: 2px;
    color:#636;
}
div.post p.postfoot {
    width: 587px;
    position:relative;
    margin-left:0px;
    padding-left: 30px;
    padding-bottom : 18px;
    margin-bottom : 0px;
    height:28px;
    color: #777;
    background: url(http://blog.run2me.com//images/run2me_com/geniusleft/108/o_post_footer.jpg) left bottom no-repeat;

}
.postfoot a {
    color: #777;
    text-decoration: underline;
}
.postfoot a:hover {
    color: #BBB;
}
#leftmenu {
    float: right;
    width: 218px;
    margin-top: 5px;
    margin-bottom: 30px;
    text-align: left;
    line-height: 160%;
    overflow: hidden;
    table-layout: fixed;
    word-break: break-all;
    padding-top: 49px;
    padding-left: 20px;
    background: url(http://blog.run2me.com//images/run2me_com/geniusleft/108/o_sidebar.jpg) left top no-repeat;
}
#leftmenu ul, #leftmenu .RecentComment {
    margin-bottom: -40px;
    margin-left: -20px;
    margin-top:-18px;
    list-style: none;
    background: url(http://blog.run2me.com//images/run2me_com/geniusleft/108/o_outer_sidebar.jpg) left top repeat-y;
}
#leftmenu p{display:none;}
#leftmenu ul
{
    padding: 30px 3px;
        padding-left:20px;
    padding-bottom:60px;

    }
    #leftmenu .RecentComment
    {
    padding: 10px 3px;    
        padding-left:20px;
    padding-bottom:60px;

    }
#leftmenu a {
    color: #BBB;
    text-decoration: underline;
}
#leftmenu a:hover {
    color: #B0DCF0;
    text-decoration: underline;
}
#leftmenu h3 {
    display: block;
    width: 188px;
    height: 25px;
    margin: 10px 0 20px -10px;
    padding: 11px 0 0 20px;
    font-size: 110%;
    text-align: left;
    line-height: 120%;
    color: #B0DCF0;
    background: url(http://blog.run2me.com//images/run2me_com/geniusleft/108/o_sh2.png) left top no-repeat !important;
    *position: relative;
    *background: none;
    *filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, src=//images/run2me_com/geniusleft/108/o_sh2.png, sizingMethod=scale);
}
.sideBottom {
    height: 40px;
    margin-left: -20px;
    background: url(http://blog.run2me.com//images/run2me_com/geniusleft/108/o_side_bottom.jpg) left bottom no-repeat;
}
#comments {
    padding: 0 30px 15px;
    background: url(http://blog.run2me.com//images/run2me_com/geniusleft/108/o_post_back.jpg) left top repeat-y;
}
#comments h3 {
    margin-bottom: 20px;
    font-size: 110%;
    color: #B0DCF0;
}
#comments li {
    margin-bottom: 15px;
    color: #BBB;
    border-bottom: 1px solid #3A3C3F;
}
#comments h4 {
    margin-top: 10px;
}
#comments h4 a {
}
#comments h4 a:hover {
}
#comments p {
    margin: 5px 0;
    padding: 5px;
    color: #AAA;
    border: 1px solid #444;
    background: #333;
}

.commentForm {
    margin: 0;
    padding: 0 30px 20px;
    background: url(http://blog.run2me.com//images/run2me_com/geniusleft/108/o_post_back.jpg) left top repeat-y;
}
#commentForm textarea {
    width: 400px;
    margin: 5px 0;
}
span.highlight {
    background-color:Yellow;
    padding: 0 0.5em 0 0.5em;
    font-weight:bold;
    }

<script type="text/javascript">
document.getElementById("MainStyle").disabled = true;
function refineStyle()
{
    var leftmenu = document.getElementById("leftmenu");
    var sidebottom = document.createElement("div");
    sidebottom.className = "sideBottom";
    leftmenu.insertBefore(sidebottom,null);
}
window.onload = refineStyle;
</script>

从杜胖子巧菜馆吃完晚饭出来，正穿过车辆熙攘的马路中央。不远处天际“嘭”地很大一声，夜色随之迷蒙。于是我驻足，仰望，开声，“哇！！！”好璀璨的流烟啊。

“嘭嘭砰砰”驰骋遐迩，夜幕五彩缤纷，某处闪耀一下，就消失了，只留下些微遐想与烟尘，少顷隐没了痕迹。就这一声开场特别近也特别大，随后陆续迸发的烟花也很近也很大，街道边的商店也纷纷在放鞭炮，一时仿佛陷身梦幻，也让我很蠢蠢欲动。

“噢！！！”我手指着左边夜空，一辆公交车擦着我指出的左手食指指甲往身后开去了，留下一指甲缝的黑泥。

“哇！！！”我激动地瞪大眼睛，一辆出租车在我身后鸣喇叭老半天了，没那闲功夫搭理它！半晌，它绕了个弯，从我右侧“嗖”地飚过去了，把我剐转了六十度身体，嘿，正好调整视角。

“啊！！！”我呆若木鸡，一辆拉泔水的小三轮“突突突”蹭过去，磨磨蹭蹭地还留下一路难闻味，我不得不拍拍衣服，重塑一下站姿。

“噢——哇——啊！！！”我手舞足蹈，身前身后的一群司机全骂开了：“你再不让路，可真撞你了！”我屁滚尿流。

失魂落魄地走进房间后，我还保持着进门时看到的附近彼时在放的小烟火的会心失笑。真的是小巫见大巫，人家的都是绽放在百米高空能占据人整个视界让人目眩的巨大烟花，声音也是震山响，它可好，将将然冲上五六层楼阳台旁，小心地轻轻“噗”一声，一朵银色小花转瞬即逝，知道它看不见，然我莞尔。

小时候捡放过没点着的小鞭炮，简单包装两厘米来长那种，谁家过年设宴不放炮仗啊，噼里啪啦一阵乱响过后，简直遍地炮灰，一群小孩攒动着小脑袋弯腰淘沙见金。

有了压岁钱不懂事就专门自己去买，五十响，一百响，名字很威武呢，说出来吓死你，霹雳电光鞭！不过成就感就少了些，不够心悬刺激，嘿嘿！

当时大家的目标是：能放敢放那种九十厘米来长的大炮仗，引线特别短，爆得特别响，炸得特别疼，从而被伙伴们膜拜，那时擦擦血汗，欣慰地觉着一切都值得了。

一次，也许八岁，也许九岁。

手持大炮仗的末端，其引线已燃过所剩特短，只有二三毫米的样子，我眼下将为大家表演点着即扔安然无恙的高难度特技场面，请大家看好！拿着烟头，颤巍巍递上引线，立马“嗙”地一声，几丝带硫磺味的青烟撩过，我站在那里懵了，左手全是血！虎口裂了好大的口子！大拇指的指甲完全炸飞了！

许多年过去了，左手早恢复地不见疤痕了，跃跃欲试的冲动也少些了，不过这么热闹的元宵夜，我虽然不放烟火，但看着心里也特别安宁喜乐啊。

如果一生里的每一天都这么美好，那我也就知足了。