Catch Me When I Fall.

14.01.2017 Theme 02 : Catch Me When I Fall.

2017年1月14日星期六 @ 06:57

发布了自己第二个模版

这个模版也是属于比较唯美伤感
那些唯美的图片素材都是自己ps取出的
想要什么素材或者是要求设计模版的话
还是有什么不明白的想问的
随时都可以留言在CBOX里要求哦
如果喜欢的话就尽情的用吧
可是用之前一定要留言在CBOX里通知一声哦
好让我有动力继续设计下一个模版哦
严禁取走Credit哦
因为做一个模版真的很花时间和精神哦

希望大家喜欢啦

歌曲是鹿晗 - Catch Me When I Fall

<html>
<head>
<title>Catch Me When I Fall. </title>
<link rel="shortcut icon" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ96XpPLCkVM0VIch9gN3ZS9sVoZbmRh6Z18EhRS05QROKT1_afxk0Jj_g4wU5l1h3uI5kWJ35XuYixFtqRprgn4CJE2QBqKfi_qgFgyCFrEP6_CjlCQq6fD8SlRDcVFySOwI1yELtVwk1/s1600/45ecf6ed8192d1d27805a2a0c1a25c.png" />

<!-------------------------------

*******THIS IS CREDIT******
Dreamer Theme 02 | Catch Me When I Fall.
14.01.2017

---Don't Steal---
---Don't Claim As Your Own Code---
---Always Keep Credit Intact---

Any question?
www.emma-thegoldfish.blogspot.my

-------------------------------------->

::-webkit-scrollbar {
    width: 6px;height: 3px;padding: 2px;
}
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
    height: 0px;
    display: block;
    background-color: none;
    border:4px solid #e5e5e5;
    padding: 2px;
}
::-webkit-scrollbar-track-piece {
    background-color: none;
    border:4px solid #e5e5e5;
    
}
::-webkit-scrollbar-thumb:vertical {
    height: 3px;
    background-color: none;
    border:4px solid #ffffff;
    
}

/* ---GENERAL--- */

@import url(http://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic|Ubuntu+Condensed|Inconsolata:400,700|Montserrat:400,700);

body {
margin: 0;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyV4qxcs42A4_L0wZHDG0ZEJhHQvKKPB5Qis4TKt8JZ_Z3ihgYLsI_3bfC6Ka6WqrjKsDnhzR9X_tlGxKKwCeVZbmTp1WpNweW3ZtbHcfmnWoA4VPpQN4caMt8Rd7RnZfy2VZvSFq1f-Kq/s640/white+grid+background+2.png');
background-repeat:repeat;
background-color:#f2f2f2;
word-wrap: break-word;
color:#000000;
font-family:'Inconsolata';
font-size:12px;
line-height:160%;
overflow:hidden;
cursor: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjge_e54opBtuje1iypNqMHOV7Qj7qBGpIoghfE7gsqPZnI90LndNGK1V7nG6_CI_h6c4qC8uf605ATVEpjO6N8-EbSoqP4IZEfxw1ji6Qs_McLZqhX5c_j8pY7GWlv2jLmvGjQDBVOGmva/s1600/02.gif), progress;
}

a {
color:#b6bdc1;
text-decoration: none;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;    
transition: all .2s ease-in-out;
}
 
a:hover {
color:#3e3e3e;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;    
transition: all .2s ease-in-out;
}

h1 {
font-size:12px;
text-transform:uppercase;
font-weight:lighter;
letter-spacing:2px;
background:#f0f6f8;
padding:10px;
margin-top:0px;
text-align:center;
}
 
b, strong {
    color:;
    font-weight:bold;
}
 
i, em {
    color:#000000;
}

p {
    margin-top:0px;
    margin-bottom:8px;
}

/* ---TITLE--- */

.title{
background:#ffffff;
border:4px solid #ffffff;
padding:3px;
text-transform:uppercase;
letter-spacing:5px;
font-size:25px;
color:#e5e5e5;
margin-top:-30px;
margin-left:650px;
position: fixed !important;
z-index:0;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;
}

.title:hover{
background:none;
color:#ffffff;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;
}

/* ---NAVI SIDE--- */

.navigations{
position:fixed;
display:inline-block;
margin-top:00px;
margin-left:150px;
}

/* ---NAVI TOP--- */

.navigationtop{
position:fixed;
display:inline-block;
margin-top:-18px;
margin-left:151px;
}

.navigation{
border:4px solid #ffffff;
padding:3px;
color:#e5e5e5;
background:#ffffff;
text-transform:uppercase;
letter-spacing:1px;
font-size:12px;
margin-top:10px;
position:relative;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;
}

.navigation:hover{
color:#ffffff;
background:none;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
-ms-transition: all .4s;
transition: all .4s;
}

/* ---POST--- */

#container {
position:fixed;
margin-left:auto;
margin-right:0px;
margin-top:100px;
margin-bottom:100px;
margin-left:500px;
width:calc((250px + 110px) * 3);
height:calc((250px + 110px) * 3);
max-width:100%;
max-height:100%;
}

#entries {
color: #e5e5e5;
word-wrap: normal;
word-break: normal;
margin-top: 0px;
margin-bottom: 100px;
margin-left: 150px;
margin-right: auto;
}

#post {
background-color: #e5e5e5;
color: #ffffff;
font-family:'Inconsolata';
text-transform: uppercase;
font-size: 12px;
letter-spacing: 1px;
word-wrap: normal;
word-break: normal;
width: 650px;
height: 585px;
padding: 20px;
border-top: 5px solid #ffffff;
border-left: 5px solid #ffffff;
border-right: 5px solid #ffffff;
border-bottom: 5px solid #ffffff;
overflow: auto;
}
    
#post:hover #tags {
opacity: 1;
}

.main-title{
margin-top:1px;
text-align:left;
font-family:'Inconsolata';
text-transform: uppercase;
font-size: 14px;
color: #ffffff; 
letter-spacing:2px;  
margin: 0px 0px 0px 0px;
border-bottom: #fff 3px solid;
padding:5px;
}

.sec-title{
text-align:right;
letter-spacing: 5px;
font-family:'Inconsolata';
text-transform: uppercase;
font-size: 8px;
text-transform: uppercase;
padding: 0px;
margin-bottom:-0px;
margin-top:3px;
color:#ffffff;
}

.a1 {
letter-spacing: 2px;
font-family:'Inconsolata';
text-transform: uppercase;
font-size: 11px;
text-transform: uppercase;
padding: 5px;
color: #fff; 
display: inline-block;
letter-spacing:1px;  
background-color: #424242;
letter-spacing:2px;  
margin-left: 0px;
padding-bottom: -4px;
}

.a2 {
letter-spacing: 3px;
font-family:'Inconsolata';
text-transform: uppercase;
font-size: 11px;
text-transform: uppercase;
text-align:right;
padding-top: 5px;
padding-right: 20px;
margin-bottom:5px;
margin-top:0px;
color:#fff;
}

.mainbox{
background-color: #fcfcfc;
color: #4b3a5b;
font-size: 12px;
word-wrap: normal;
word-break: normal;
width: 840px;
padding: 20px;
border-top: 1px solid #9678a5;
border-left: 1px solid #9678a5;
border-right: 1px solid #9678a5;
border-bottom: 1px solid #9678a5;
}

#avatar img {
padding: 0px;
margin-top: 0px;
width: 500px;
}

.chan{
display:inline-block;
width: 100px;
padding:3px;
margin:5px;
font-family:'Inconsolata';
font-size:10px;
text-align:center;
Text-decoration:none;
text-transform:uppercase;
color:#ffffff;
background:#e5e5e5;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
-ms-transition: all .4s;
transition: all .4s;
border:4px solid #ffffff;
}

.chan:hover{
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
-ms-transition: all .4s;
transition: all .4s;
color:#e5e5e5;
background:#ffffff;
}

/* ---BLOCKQUOTE--- */

blockquote {
padding-left:15px;
padding-top:5px;
padding-bottom:5px;
border-left:5px solid #dddddd;
margin:5px;
-WEBKIT-TRANSITION:ALL 0.9S ease-in;
-MOZ-TRANSITION:ALL 0.9S ease-in;
-O-TRANSITION:ALL 0.9S ease-in;
 }

blockquote:hover{
padding-left:15px;
padding-top:5px;
padding-bottom:5px;
border-left:5px solid #ffffff;
margin:5px;
-WEBKIT-TRANSITION:ALL 0.9S ease-in;
-MOZ-TRANSITION:ALL 0.9S ease-in;
-O-TRANSITION:ALL 0.9S ease-in;
}

/* ---NUMBER LIST--- */

ul#label-list {
display:inline;
}

ul, li {
list-style-type: hiragana;
font-size: 13px;
color: #bddeea;
margin-top: -5px;
}

/* ---CREDIT--- */

.credit{
border:4px solid #ffffff;
padding:3px;
color:#e5e5e5;
background:#ffffff;
text-transform:uppercase;
letter-spacing:1px;
font-size:8px;
margin-top:10px;
position:relative;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;

}

.credit:hover{
color:#ffffff;
background:none;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
-ms-transition: all .4s;
transition: all .4s;
}

.chans{
border:1px solid #eee;
background:#ffffff;
padding:3px;
color:#e5e5e5;
font-size:9px;
text-transform:uppercase;
letter-spacing:1px;
margin-top:10px;
position:relative;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;
}

.chans:hover{
color:#ffffff;
background:none;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
-ms-transition: all .4s;
transition: all .4s;
}

</style>
</head>

<div class="title">
Catch Me When I Fall.</div>
<div class="navigationtop">

<a class="navigation" onClick="document.getElementById('entries').innerHTML=document.getElementById('diary').innerHTML">Diary</a>

<a class="navigation" style="font-weight: normal;" href="http://www.blogger.com/follow-blog.g?blogID=YOUR ID HERE">+ Follow</a>

</div>
<div style="position: fixed;top: 85px; left: 389px;background: white;padding:5px;">
<embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=true&f0=http://s80.youmaker.com/other/2017/1-14/mp3936555764e379ccc6ae60442880f2acc758a0dcc780.mp3&t0=Catch me when I fall.&total=10" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" />
</div>
<div class="navigations">

<$BlogItemBody$>
</div>
</blogger></div>
<div id="entries">
<div class="post">
<div id="diary" style="display:none;">
<div id="post">
<blogger>
<div class="main-title">
 <$BlogItemTitle$> </div>
<div class="sec-title">
<blogdateheader><$BlogDateHeaderDate$></BlogDateHeader> @ <$BlogItemDateTime$></div>
<br><br>

<$BlogItemBody$>

</div>
</blogger>
</div>
</div>
</div>
</div>
<div id="entries">
<div class="post">
<div id="profile" style="display:none">
<div id="post">
<div class="main-title">
EMMA THE DREAMER</div>
<div class="a2">
who loves peony</div>
<br>
<center>
<div id="avatar">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQK22TPdRz0aJpSUycYp14GSFDWujoCQOBimnVtVMei7Rley2pbzFo3JYdaCNB8L5wJX5U72rGQlHoKBF9sSlxzTE_i6IWhPS-pXDZ09dcmwble5JqfRknsI3CBDI1FM9xpk5xI46COGXo/s1600/1.png">
</div>
</center>
<br>
WRITE SOMETHING ABOUT YOURSELF HERE

</div>
</div>
<div id="entries">
<div class="post">
<div id="stuff" style="display:none">
<div id="post">
<div class="main-title">
 Stuff </div>
<div class="a2">
Tutos&FreeBs</div>
<br>
<center>
<div id="avatar">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDgeRFq9KjBQlyYIIOQ5TyMp0Y65V914SXskg3Y8myzdk0pL4lefQg3QrzN3t-RzEuxDCesJTaSxrbJMMVCeNRQDqHeZHnIQT1Xg3trIoXyzKFweuk8v8hoUprvhi-tJl_aoVfT8YfiANT/s1600/2.png">
</div>
</center>
<br>
WRITE SOMETHING HERE
</p>
<br><br>
<center>
AGREE? MOVE ON THEN
<br>
<a class="chan" href="http://dreamer-tutorial.blogspot.com/">TUTORIAL</a> / 
<a class="chan" href="http://dreamer-freebies.blogspot.com/">FREEB</a> 
</center>
</div>
</div>
<div id="entries">
<div class="post">
<div id="affie" style="display:none">
<div id="post">
<div class="main-title">
 My friend </div>
<div class="a2">
Don't Be Shy to Exchange Your Link With Me</div>
<br>
<center>
<div id="avatar">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1JQ5WdmjSYX-brkWAssF29EArSdK1zYsM26-MlAv-1ydZsFISgGgp8x9urBec0ri1HK7JDP0RkeFjPfb1ZyO0HU_XTnJdOukPRNnxvrsW1k6y8AFnCYp6wLLB8JnCB1cyITg_XaGr16Y9/s1600/3.png">
</div>
</center>
<br>
<center>
<a class="chan" href="">Next</a>
<a class="chan" href="">Next</a>
<a class="chan" href="">Next</a>
<a class="chan" href="">Next</a>
<a class="chan" href="">Next</a>

</td>
</center>
</div>
</div>
<div id="entries">
<div class="post">
<div id="chat" style="display:none">
<div id="post">
<div class="main-title">
 ChatBox</div>
<div class="a2">
Leave a message</div>
<br>

<center>
<div id="avatar">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIHXF0DPSEHBCZ-Sc47becmfU6310krRlWth-Qc1YdC1Dg3YOtCZg48y1EDFBxb-dRuht2ozM1k1YpM77lhunoSnf0fgeo4PjjD3N4wChD_84TgUUXmcpkeiykbRGZ5-l8MnKJDqLcEql2/s1600/4.png">
</div>
</center>
<br>
<center>
<div style="background:url() repeat; border:4px solid #ffffff;padding:5px;width:550px;">
YOUR CHATBOX CODE HERE
</center>
</div>
</div>
</div>
</div>
<div style="position: fixed;bottom: 7px; right: 5px;z-index:0;">
<div class="credit">
Theme : 02 Catch Me When I Fall.<br>
Credit : <a class="chans" href="emma-thegoldfish.blogspot.com/">TheDreamer</a><br>
Material :  <a class="chans" href="http://dreamer-freebies.blogspot.com/">Dreamer Freebies</a>
</div>
</div>
</body>
</html>

代码在这里哦，直接Copy全部Paste在修改模版HTML的Textarea里面就大功告成了