นิยาย &YOU ✿ iD DREAM ' > ลำดับตอนที่ #2 : &YOU

ลำดับตอนที่ #2

&YOU ✿ iD DREAM '

ลำดับตอนที่ #2 : &YOU | BLOGSKINS.001

อัปเดตล่าสุด 19 พ.ค. 59

&YOU | BLOGSKINS.001

ต้นฉบับ [ 54: あ ] | preview

<html><head><title>seams*//</title>

<style>

#navbar-iframe{display:none;}
::selection{color:#fff; background:#000;}
::-moz-selection{color:#fff; background:#000;}

::-webkit-scrollbar{width:5px; height:10px;}
   
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {height:0px; display:block; background-color:transparent;}
   
::-webkit-scrollbar-track-piece{background-color:#fff; -webkit-border-radius:0px;}
   
::-webkit-scrollbar-thumb:vertical{height:40px; background-color:#bdbdbd; background-image:url(); border:1px solid #ffffff; -webkit-border-radius:0px;}

body{background:#f9f9f9; background-image:url(); background-repeat:repeat; background-attachment:fixed; font-family:arial; font-size:10px; cursor:default; color:#3b3b3b;}

table{font-family:arial; font-size:10px; cursor:default; color:#3b3b3b;}

#header01{font-family:arial; font-size:9px; letter-spacing:0px; background:; color:#424242; text-transform:uppercase; font-weight:bold; border:1px solid #e6e6e6;}

#header02{border-bottom:1px dotted #bdbdbd; font-family:georgia; font-size:14px; background:#f2f2f2; color:#fff; text-transform:lowercase; font-weight:bold; color:#2b2b2b; margin-bottom:2px;}

#nav01{color:#fff; text-align:right; text-transform:uppercase; font-family:arial; font-size:9px; background:#6EA49F; font-weight:bold; letter-spacing:0px; margin-bottom:1px; -webkit-transition:all 0.6s ease-out; -moz-transition:all 0.6s ease-out; transition:all 0.6s ease-out; box-shadow:0px 0px 0px #fff inset; -moz-box-shadow:0px 0px 0px #fff inset; -webkit-box-shadow:0px 0px 0px #fff inset;}

#nav01:hover{box-shadow:90px 0px 0px #fff inset; -moz-box-shadow:90px 0px 0px #fff inset; -webkit-box-shadow:90px 0px 0px #fff inset; color:#6EA49F;}

#nav02{color:#fff; text-align:right; text-transform:uppercase; font-family:arial; font-size:9px; background:#7EBFB9; font-weight:bold; letter-spacing:0px; margin-bottom:1px; -webkit-transition:all 0.6s ease-out; -moz-transition:all 0.6s ease-out; transition:all 0.6s ease-out; box-shadow:0px 0px 0px #fff inset; -moz-box-shadow:0px 0px 0px #fff inset; -webkit-box-shadow:0px 0px 0px #fff inset;}

#nav02:hover{box-shadow:90px 0px 0px #fff inset; -moz-box-shadow:90px 0px 0px #fff inset; -webkit-box-shadow:90px 0px 0px #fff inset; color:#7EBFB9;}

#nav03{color:#fff; text-align:right; text-transform:uppercase; font-family:arial; font-size:9px; background:#8FDAD3; font-weight:bold; letter-spacing:0px; margin-bottom:1px; -webkit-transition:all 0.6s ease-out; -moz-transition:all 0.6s ease-out; transition:all 0.6s ease-out; box-shadow:0px 0px 0px #fff inset; -moz-box-shadow:0px 0px 0px #fff inset; -webkit-box-shadow:0px 0px 0px #fff inset;}

#nav03:hover{box-shadow:90px 0px 0px #fff inset; -moz-box-shadow:90px 0px 0px #fff inset; -webkit-box-shadow:90px 0px 0px #fff inset;color:#8FDAD3;}

.post{padding:20px; background:#fff; border-bottom:1px solid #ddd;}

.post img{width:402px; padding:3px; border:1px solid #ddd; margin-bottom:3px; margin-top:2px;}

.post01{padding:20px; background:#fff; border-bottom:1px solid #ddd;}

.post01 a img{-webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
.post01 a img:hover{opacity:0.1; filter:alpha(opacity=10); zoom:1;}

.blogger-labels{text-transform:lowercase; border-left:5px double #8FDAD3; line-height:80%; padding-left:10px;}

blockquote{border-top:1px dotted #d1d1d1; border-bottom:1px dotted #d1d1d1; color:#848484; padding:5px;}

a{text-decoration:none; color:#7EBFB9; -webkit-transition:all 0.1s ease-out; -moz-transition:all 0.1s ease-out; transition:all 0.1s ease-out;}

a:hover{color:#ddd;}

a.end01{display:block; color:#fff; text-align:right; text-transform:uppercase; font-family:arial; font-size:9px; background:#2b2b2b; font-weight:bold; letter-spacing:0px; margin-bottom:5px; -webkit-transition:all 0.6s ease-out; -moz-transition:all 0.6s ease-out; transition:all 0.6s ease-out; box-shadow:0px 0px 0px #fff inset; -moz-box-shadow:0px 0px 0px #fff inset; -webkit-box-shadow:0px 0px 0px #fff inset;}

a.end01:hover{box-shadow:90px 0px 0px #fff inset; -moz-box-shadow:90px 0px 0px #fff inset; -webkit-box-shadow:90px 0px 0px #fff inset;color:#2b2b2b; cursor:vertical-text;}

a.end02{color:#2b2b2b; font-size:18px; padding:0px 5px 0px 5px; text-shadow:4px 0px 0px #7EBFB9; -webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}

a.end02:hover{text-shadow:1px 0px 0px #7EBFB9;}

a.end03{display:block; color:#fff; text-align:right; text-transform:uppercase; font-family:arial; font-size:9px; background:#598480; font-weight:bold; letter-spacing:0px; margin-bottom:1px; -webkit-transition:all 0.6s ease-out; -moz-transition:all 0.6s ease-out; transition:all 0.6s ease-out; box-shadow:0px 0px 0px #fff inset; -moz-box-shadow:0px 0px 0px #fff inset; -webkit-box-shadow:0px 0px 0px #fff inset;}

a.end03:hover{box-shadow:90px 0px 0px #fff inset; -moz-box-shadow:90px 0px 0px #fff inset; -webkit-box-shadow:90px 0px 0px #fff inset; color:#598480; cursor:vertical-text;}

b,strong{text-transform:uppercase; font-weight:bold; background:#7EBFB9; color:#fff;}

u{border-bottom:2px solid #7EBFB9; color:#424242;}

i{color:#bdbdbd;}

</style>

</head>
<body>

<br>
<span style="font-family:georgia; font-weight:bold; font-size:14px; color:#000; line-height:80%;">happy endings are stories that <i><span style="text-shadow:-3px 0px 0px #7EBFB9; color:#000;">haven't</span></i> ended yet</span>

</div>

<a class="end01" href="javascript:void(0);" onClick=window.open("http://www.blogger.com/follow-blog.g?blogID=2059203766986095858","Ratting","width=550,height=550,0,status=0,");>follow</a>
<a class="end03" href="/">index</a>
<div id="nav01" onClick="changeNavigation('one')"
onMouseover="this.style.cursor='vertical-text'"
onMouseout="this.style.cursor='default'">about</div>
<div id="nav02" onClick="changeNavigation('two')"
onMouseover="this.style.cursor='vertical-text'"
onMouseout="this.style.cursor='default'">archive</div>
<div id="nav03" onClick="changeNavigation('three')"
onMouseover="this.style.cursor='vertical-text'"
onMouseout="this.style.cursor='default'">misc</div>

</div>

<div id="header02"><$BlogItemTitle$></div>
     <div id="header01">// <BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> / <$BlogItemDateTime$> //
<BlogItemCommentsEnabled><a name="comments"></a><a title="<$BlogItemCommentCount$>" class="permalinkk" href="<$BlogItemCommentCreate$>" <$BlogItemCommentFormOnClick$>>comment<BlogItemComments><a name="<$BlogCommentNumber$>"></a></BlogItemComments></a></BlogItemCommentsEnabled></div>

</div><br><br>

</Blogger>

<div align="center">
<div style="float:left; width:50%; text-align:left;">
<newerposts><a class="end02" href="<$newerposts$>">&laquo;</a></newerposts></div>
<div style="float:right; width:50%; text-align:right;">
<olderposts><a class="end02" href="<$olderposts$>">&raquo;</a></olderposts></div>
   </div>

</div>
<div id="one" style="display:none;">

<div id="header02">プロフィール</div>
     <div id="header01">// about me</div><br>

こんにちは!私はtallyです
日本 &middot; 19歳 &middot; アニメが好き&hearts;<br>
<b>bold</b><i>italic</i><u>underline</u><br><br>

Est praesent luptatum. Dignissum qui blandit est praesent luptatum delenit aigue excepteur sint occae. At vver eos et accusam dignissum qui blandit est praesent luptatum delenit aigue excepteur sint occae.<br><br>

Et harumd dereud facilis est er expedit distinct. Yea throw your profile here.<br><br><br>

</div>
<div id="two" style="display:none;">

<div id="header02">アーカイブ</div>
     <div id="header01">// older posts</div><br>

<b>archive by months</b><br>
<BloggerArchives>
✦ <a href="<$BlogArchiveURL$>"><$BlogArchiveName$></a><br>
</BloggerArchives>

</td><td valign="top" width="50%">

<b>archive by posts</b><br>
<BloggerPreviousItems>
✦ <a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a><br>
</BloggerPreviousItems>

</td></tr></table>

</div>

</div>
<div id="three" style="display:none;">

<div id="header02">いろいろな</div>
     <div id="header01">// miscellaneous, etcetera</div><br>

<b>affiliates</b><br>
✦ <a href="http://blogger.com">Abigail</a> /
<a href="http://blogger.com">Arianwen</a> /
<a href="http://blogger.com">Brittany</a><br>
✦ <a href="http://blogger.com">Calliope</a> /
<a href="http://blogger.com">Desiree</a><br>
✦ <a href="http://blogger.com">Daniel</a> /
<a href="http://blogger.com">Esmeralda</a> /
<a href="http://blogger.com">Francine</a><br>
✦ <a href="http://blogger.com">Gregory</a>

</td><td valign="top" width="50%">

<b>blogskin credits</b><br>
✦ Layout coded by <a href="http://blogskins.com/me/16thday">16th</a><a href="http://curvingends.blogspot.com">day</a><br>
✦ Sidebar icon from <a href="http://www.thefadingnight.blogspot.com">thefadingnight</a><br>
✦ Profile social site icons from <a href="http://iconmonstr.com/">iconmonstr</a><br>
✦ Sidebar pattern from <a href="http://subtlepatterns.com/">subtlepatterns</a>

</td></tr></table>

</div>

</div></body></html>

แก้ไข | preview

::-webkit-scrollbar{width:5px; height:10px;}
   
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {height:0px; display:block; background-color:transparent;}
   
::-webkit-scrollbar-track-piece{background-color:#fff; -webkit-border-radius:0px;}
   
::-webkit-scrollbar-thumb:vertical{height:40px; background-color:#bdbdbd; background-image:url(); border:1px solid #ffffff; -webkit-border-radius:0px;}

body{background:#f9f9f9; background-image:url(); background-repeat:repeat; background-attachment:fixed; font-family:arial; font-size:10px; cursor:default; color:#3b3b3b;}

table{font-family:arial; font-size:10px; cursor:default; color:#3b3b3b;}

#header01{font-family:arial; font-size:9px; letter-spacing:0px; background:; color:#424242; text-transform:uppercase; font-weight:bold; border:1px solid #e6e6e6;}

#header02{border-bottom:1px dotted #bdbdbd; font-family:georgia; font-size:14px; background:#f2f2f2; color:#fff; text-transform:lowercase; font-weight:bold; color:#2b2b2b; margin-bottom:2px;}

a.nav01{display:block; color:#fff; text-align:right; text-transform:uppercase; font-family:arial; font-size:9px; background:#6EA49F; font-weight:bold; letter-spacing:0px; margin-bottom:1px; -webkit-transition:all 0.6s ease-out; -moz-transition:all 0.6s ease-out; transition:all 0.6s ease-out; box-shadow:0px 0px 0px #fff inset; -moz-box-shadow:0px 0px 0px #fff inset; -webkit-box-shadow:0px 0px 0px #fff inset;}

a.nav01:hover{box-shadow:90px 0px 0px #fff inset; -moz-box-shadow:90px 0px 0px #fff inset; -webkit-box-shadow:90px 0px 0px #fff inset; color:#6EA49F;}

a.nav02{display:block; color:#fff; text-align:right; text-transform:uppercase; font-family:arial; font-size:9px; background:#7EBFB9; font-weight:bold; letter-spacing:0px; margin-bottom:1px; -webkit-transition:all 0.6s ease-out; -moz-transition:all 0.6s ease-out; transition:all 0.6s ease-out; box-shadow:0px 0px 0px #fff inset; -moz-box-shadow:0px 0px 0px #fff inset; -webkit-box-shadow:0px 0px 0px #fff inset;}

a.nav02:hover{box-shadow:90px 0px 0px #fff inset; -moz-box-shadow:90px 0px 0px #fff inset; -webkit-box-shadow:90px 0px 0px #fff inset; color:#7EBFB9;}

#nav03{color:#fff ; text-align:right; text-transform:uppercase; font-family:arial; font-size:9px; background:#8FDAD3; font-weight:bold; letter-spacing:0px; margin-bottom:1px; -webkit-transition:all 0.6s ease-out; -moz-transition:all 0.6s ease-out; transition:all 0.6s ease-out; box-shadow:0px 0px 0px #fff inset; -moz-box-shadow:0px 0px 0px #fff inset; -webkit-box-shadow:0px 0px 0px #fff inset;}