Fairy Blog Design: Teljes Design Kóddal #1

Most olyan bejegyzést hoztam,amiben design-neket kóddal hoztam.Mivel ezt elég bonyolult elkészíteni,úgy gondoltam nyomozok párat az interneten.Szerintem a 2.-ik a legszebb*-* És tádá!Hoztam nektek 3-at,ha szeretnétek,hogy hozzak még,akkor komizzatok! :') Figyelem!Nem én készítettem őket!Ne töröljétek ki a készítő nevét!Köszönöm!
Na,akkor itt is vannak:

Na és most akkor jöjjönek a kódok:

Az első Design kódja:

<html>

rel='stylesheet' type='text/css'>

<title>おかしいとかわいい</title>

#navbar-iframe {

display: none;

}

body {

background:#fff;

font-family: trebuchet ms;

background-attachment:fixed;

color: c;

font-size: 11px!important;

}

a:link, a:visited {

color:#ffcfcf;

text-decoration:none;

}

a:hover {

color: #deffcf;

}

font-family: georgia; font-size:9px; font-style: italic; color: #cfefff;}

color: #FFF4CF;}

text-decoration:none; color: #E3CFFF; border-bottom: 1px dashed #FFCFCF;

}

.page {

background:#ffffff;

color:#666666;

padding:14px;

width:550px;

font-size:11px;

text-align:justify;

}

.title {

color:#cfefff;

Text-align: left;

font-size:18px;

text-transform: lowercase;

font-family: georgia;

font-style: italic;

padding: 3px;

padding-bottom: 5px;

}

.date{

text-transform: capitalize;

font-size:10px;

margin-bottom: 1em;

background-color: #cfefff;;

color: white;

padding: 3px;

}

.date a {

font-size:10px;

color: white;

}

::-webkit-scrollbar {

height:8px;

width: 8px;

background:#FFFFFF;

}

::-webkit-scrollbar-thumb {

background-color: #deffcf;

border-radius:10px;

}

blockquote {

Border: 1px dashed #ffcfcf;

padding:10px;

border-radius:2px;

}

.ra{

background: url(http://i.imgur.com/pcHmg.png);

padding: 15px;

width:580px;

margin-left:150px;

box-shadow: 4px 3px 4px #eee;

}

.in{

width: 65px;

padding: 8px;

height:729px;

position: fixed;

background: url(http://i.imgur.com/pcHmg.png);

left: 0px;

top: 0px;

box-shadow: 4px 0px 4px #eee;

}

a.aff {

background: #e3cfff;

width: 100px;

padding: 5px;

display: inline-block;

border: 1px solid #e3cfff;

color: white;

text-transform: uppercase;

font:8px tt;

text-align: center;

margin-bottom:3px;

}

a.bow {

background: #fff4cf;

width: 90px;

padding: 5px;

display: inline-block;

border: 1px solid #fff4cf;

color: white;

text-transform: uppercase;

font:8px tt;

text-align: center;

margin-bottom:3px;

}

a.bow:hover{

background: #fff;

width: 90px;

padding: 5px;

display: inline-block;

border: 1px solid #fff4cf;

color: #fff4cf;

text-transform: uppercase;

font:8px tt;

text-align: center;

margin-bottom:3px;

}

a.kevo{

width:50px;

padding:4px;

margin:2px;

background:#fff;

color:#ffcfcf;

font:8px tt;

text-align:center;

Text-decoration:none;

text-transform:uppercase;

display:inline-block;

height:28px;

padding-top:25px;

border-radius:50%;

-webkit-transition:All 0.5s ease;

-moz-transition:All 0.5s ease;

-o-transition:All 0.5s ease;

transform: rotate(0deg) ;

-webkit-transform: rotate(0deg) ;

-moz-transform: rotate(0deg) ;

-o-transform: rotate(0deg) ;

-ms-transform: rotate(0deg) ;

}

a.kevo:hover{transform: rotate(360deg) ;

-webkit-transform: rotate(360deg) ;

-moz-transform: rotate(360deg) ;

-o-transform: rotate(360deg) ;

-ms-transform: rotate(360deg) ;

color: #deffcf;

}

@font-face {

font-family:tt !important;

src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf') !important;

}

ul{

list-style: hiragana-iroha;

}

#cboxdiv {

z-index: 9999;

position: fixed;

bottom: -306px;

right: 20px;

-webkit-transition: all 1s ease-in-out;

-moz-transition: all 1s ease-in-out;

-o-transition: all 1s ease-in-out;

transition: all 1s ease-in-out;

}

#cboxdiv:hover {

bottom: 0px;

}

#cboxtitle {

text-align: center;

font-size: 20px;

font-family: codystar;

letter-spacing: 8px;

color: #666;

width: 180px;

background: url(http://i.imgur.com/zOflB.png);

padding: 3px 5px 5px 5px;

border-top-left-radius: 10px;

border-top-right-radius: 10px;

}

td.tr-caption{font-family: georgia; font-size:10px; font-style: italic; color: #FFCFCF;padding-bottom:8px;}

p.blogger-labels{

border-top: 1px solid #eee; padding-top: 1em; padding-left: 1em; font-family: georgia; font-size:9px; font-style: italic; color: #E3CFFF;}

</style>

<NewerPosts><a class="kevo" href=<$NewerPosts$>>NEWER</a></NewerPosts><br><a class="kevo" onClick="document.getElementById('content').innerHTML=document.getElementById('about').innerHTML" title="About">about</a><br>

<a class="kevo" onClick="document.getElementById('content').innerHTML=document.getElementById('buddy').innerHTML" title="Chingu">chingu</a><br>

<a class="kevo" onClick="document.getElementById('content').innerHTML=document.getElementById('journal').innerHTML" title="Entry">entry</a><br>

<a class="kevo" href="LINK HERE">twitter</a><br>

<a class="kevo" href="LINK HERE">facebook</a><br>

<a class="kevo" href="LINK HERE">tumblr</a><br>

<a class="kevo" href="LINK HERE">follow</a><br>

<OlderPosts><a class="kevo" href=<$OlderPosts$>>OLDER</a> </OlderPosts>

</div>

<body>

<div class="date"><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> »

<$BlogItemDateTime$> » <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick

$><$BlogItemCommentCount$> comments</a></BlogItemCommentsEnabled></div>

<$blogitembody$></div><br></blogger></div></div><br><br><br>

<div class="title">a short story.</div>

<div class="date">a baby borns this year.</div>

a baby born this year. many people smile look at him/her. cause she/he comes and bring some miracles.<br>

<img width="11px" src="http://media.tumblr.com/tumblr_mc45krpPhz1qdlkyg.gif"/> date of birth : <br>

<img width="11px" src="http://media.tumblr.com/tumblr_mc45krpPhz1qdlkyg.gif"/> nationality: <br>

<img width="11px" src="http://media.tumblr.com/tumblr_mc45krpPhz1qdlkyg.gif"/> hobbies : <br>

<img width="11px" src="http://media.tumblr.com/tumblr_mc45krpPhz1qdlkyg.gif"/> favorite things : <br><br><img width="80px" src="http://media.tumblr.com/tumblr_mcmtrcALci1ro2kde.png" style="border-radius: 50px 50px 50px 0px; margin-left: 10px; margin-bottom:8px; float: right;"/>

<img src="http://media.tumblr.com/tumblr_meb626MgkB1qdlkyg.gif"/> since born, i live with my family. yup. my lovely family. i liked to share many jokes with my little bro. told my daily story with my older sister. and shared my study at school with my parents. they were coloring my life. and they gave me full of love. they were my special people.<br><br>

<img src="http://media.tumblr.com/tumblr_meb61r7xVt1qdlkyg.gif"/> best friends. Places for me shared about loves, hates, and manymore. they were coloring my life. they always cheered me if i was sad. they always made a jokes. although their jokes was not fun. they always helped me if i can't do anything. but, sometimes we were fighting. just about a little thing. that is freindship.<br><br>

<div style="text-align: right;"><i>-sincerenly, butterfly. {change with yourself}</i></div>

<div class="title">tomodachi.</div>

<div class="date">exchange links still open</div>

<center><blockquote><img width="450px" src="http://data.whicdn.com/images/49751898/tumblr_mgsr20kxWh1qm8abco1_r1_500_large.jpg"/><br><img src="http://media.tumblr.com/tumblr_meb63emuCZ1qdlkyg.gif"/>exchange links still open. tell me if you wanna. put me first. and i will put you ^^.</blockquote>

<a target="_blank" class="bow" href="link">chingu</a>

<a target="_blank" class="bow" href="link">chingu</a><br><br></center></div>

<br>

<div class="title">arigatou.</div>

<div class="date">stuffies from them.</div>

template made by <a href="http://reichionnie.blogspot.com" target="_blank">reic</a><a href="http://blogskins.com/me/rahmadha_madha" target="_blank">hion</a><a href="http://rahmadhamadha.tumblr.com/" target="_blank">nie</a>. they big helped me at coding : <a href="http://wanaseoby.blogspot.com" targe="_blank">wanaseoby</a> <a href="http://kyorine.blogspot.com" target="_blank">lettha</a> <a href="http://zaranerd.blogspot.com/" target="_blank">jaera</a>. thanks for <a href="http://cocorini.tumblr.com/" target="_blank">cocorini</a> for the chatbox tutorial. and the last big applause for <a href="http://mamikaname.tumblr.com/post/34536394774/aaaaaand-heres-the-second-part-i-promised" target="_blank">anathema</a> and <a href="http://pixel-diary.tumblr.com/tagged/set/" target="_blank">pixel-diary</a> for their kawaii icons and pixel.</div>

</div>

<div class="date"><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> »

<$BlogItemDateTime$> » <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick

$><$BlogItemCommentCount$> comments</a></BlogItemCommentsEnabled></div>

<$blogitembody$></div><br></blogger></div>

</img></div><br></div>

<div id="cboxtitle">chatbox</div>

</div>

</div>

</body>

</head>

</html>

document.ondragstart = function () { return false; }; </script>

A második Design kódja:

#navbar-iframe, .blogger-labels {display:none;}

::-webkit-scrollbar {width:8px;background:#f1f1f1;}

::-webkit-scrollbar-thumb {background:#bfb4dd;}

::selection {background:#bfb4dd;color:#fff;}

body {background:url(http://media.tumblr.com/f39d9af5535d216f7b8f33dd79fd265f/tumblr_inline_mi56gohFKh1qz4rgp.png);font-family:Roboto;font-size:8pt;color:#6f6f6f;text-align:justify;line-height:110%;}

td {font-family:Roboto;font-size:8pt;color:#6f6f6f;text-align:justify;line-height:110%;}

a:link, a:visited, a:active {color:#222;text-decoration:none;} a:hover {color:#bfb4dd;text-decoration:none;}

b, strong {color:#000;cursor:pointer;}

i, em {color:#bbaabb;}

s, strike {color:#bb9999;}

blockquote {color:#aaa;font-style:italic;background:#fcfcfc;font-family:cambria;}

blockquote:before {content:"\275D";height:auto;font-size:44px;color:#bbaabb;float:left;padding-right:11px;}

img {max-width:500px;margin-bottom:3px;cursor:pointer;}

.menutop {background:#a195c4;font-family:'Scada';width:870px;text-transform:uppercase;font-size:14px;color:#fff;position:absolute;top:10px;}

.nav, a.nav {color:#fff;text-align:center;text-shadow:1px 1px 0px #8074a3;margin:10px;display:inline-block;}

.nav:hover, a.nav:hover {color:#fff;cursor:pointer;}

#aboy {padding:8px;background:#fcfcfc;}

.box {width:850px;font-family:Roboto, cambria;font-size:8pt;color:#6f6f6f;}

.post {padding:10px;text-align:justify;width:570px;line-height:110%;margin-bottom:20px;line-height:140%;}

.title {color:#bfb4dd;padding:6px;font-family:Yanone Kaffeesatz;font-size:22px;margin-top:10px;cursor:pointer;}

.date {margin-left:40px;color:#80759e;text-transform:uppercase;padding:1px;font-family:consolas;font-size:8px;}

.sidebar {width:230px;padding:10px;border-right:1px solid #efeef3;box-shadow: 5px 1px 10px #f1f1f1;background:#f8f6ff;border-radius: 3px 0 0 4px;}

.stit {background:#9589b8;color:#fff;font-family:'Fjalla One';font-size:11px;letter-spacing:5px;text-transform:uppercase;text-shadow:1px 1px 0px #877aad;padding:3px;margin-bottom:3px;}

#sts {display:block;margin-bottom:1px;padding:2px;font-size:10px;text-transform:uppercase;background:#f3e9ff;border-radius:2px;color:#fff}

#sts a {color:#666;}

a.mv {font-size:8px;text-transform:uppercase;display:block;padding:2px;margin:1px;color:#bbb;background:#fafafa; border:1px solid #f5f5f5;}

a.mv:hover {background:#fcfcfc;border:1px solid #fafafa;color:#555;}

jess {background:#f9f9f9;display:block;padding:2px;font-size:10px;}

jess a {background:#ada6d5;color:#fff;display:inline-block;width:80px;margin-right:5px;}

jess a:hover {background:#e3e0f5;color:#222;}

a.stf {background:#bab5d8;color:#fff;display:block;padding:1px;margin:1px;}

a.stf:hover {background:#8981b5;}

a.stf:before {content:'➜ ';} a.stf:hover:before {content:'✔ ';}

a.aff {background:#fcfcfc;color:#ccc;display:inline-block;width:102px;padding:1px;margin:1px;text-align:center;border:1px solid #fafafa;}

a.aff:hover {background:#f6f6f6;color:#aaa;}

#slider {position:relative;} #slider img {display:none;width:250px;} #slider a {display:block;}

.nivoSlider {width:300px;height:130px;} .nivoSlider img {width:300px;height:130px;}

.nivo-slice {display:block;position:absolute;z-index:5;height:100%;} .nivo-box {display:block;position:absolute;z-index:5;}

.nivo-caption {position:absolute;left:0px;bottom:0px;background:#000;color:#fff;text-transform:uppercase;width:98%;

z-index:50;border-right:0px solid #;padding:3px;}

.nivo-caption p {margin:0;font-size:11px;} .nivo-caption a {display:inline;} .nivo-html-caption {display:none;}

.nivo-directionNav a {position:absolute;top:45%;z-index:99;cursor:pointer;} .nivo-prevNav {left:0px;} .nivo-nextNav {right:0px;}

.slider {width:100%;} .slider a {border:0;display:block;}

.slider img {position:absolute;top:0px;left:0px;display:none;width:250px;} .nivo-controlNav {display:none;}

.nivo-directionNav a {display:block;width:31px;height:34px;background:url(http://i.imgur.com/IU5Sj12.png) no-repeat;text-indent:-9999px;}

a.nivo-nextNav {background-position:-30px 0;right:15px;} a.nivo-prevNav {left:15px;}

.nivo-caption {font-weight:2;} .nivo-caption a {color:#efe9d1;}

</style><script>function changeNavigation(id) {document.getElementById('main').innerHTML=document.getElementById(id).innerHTML}</script>

});}); </script>

<body>

<div class="menutop">navigation :

<div class="nav" onClick="changeNavigation('a')"> about</div>

<div class="nav" onClick="changeNavigation('c')"> likes</div>

<div class="nav" onClick="changeNavigation('d')"> message</div>

<div class="nav" onClick="changeNavigation('e')"> stuff</div>

<div class="nav" onClick="changeNavigation('f')"> friends</div>

<a class="nav" href="http://www.blogger.com/follow-blog.g?blogID=YOURBLOGID">+ follow</a>

</div>

<div class="stit">status</div>

<div id="sts">online: <script language="JavaScript">

var ref = (''+document.referrer+''); var page = (''+window.location+'');

document.write('<script src="http://s1.freehostedscripts.net/ocounter.php?site=ID2498918&e1=&e2=&p=' + page + '&r=' + ref + '"><\/script>'); </script> </div>

<div id="sts">owner: your name</div>

<div id="sts">followers: +100000</div>

<br>

<div class="stit">welcome, darling</div>

Full this box with something about your blog. By the way, thank you for checking my new layout keke Please don't remove the credits, I worked hard on this skin. Be happy & get your boy or die al0ne!

</div><br>

<center style="font-size:7pt;font-style:italic;">*put your ask.fm or formspring widget right here. max width is 230px.*</center>

<br>

<div class="stit">musicbox</div><center>

</center><br>

<a href="/" class="mv"># personal</a>

<a href="/" class="mv"># photos</a>

<a href="/" class="mv"># tutorials</a>

<a href="/" class="mv"># skins</a>

<a href="/" class="mv"># other</a>

<br>

<!---PLEASE DON'T TOUCH THIS PART OF THE CODES. I WORKED HARD ON THIS SKIN.---!>

<div class="stit">credits</div>

© 2013 - Layout by <a href="http://www.momoiro.tk/">pink</a><a href="http://blogskins.com/me/sunwoo">tape</a> and edited by <a href="/">yourname</a>. Icons from <a href="http://agitatedscandals.blgospot.com">as</a>, images from <a href="http://weheartit.com">we❤it</a>, symbols from <a href="http://villianz.blogspot.com.br/">vlz</a>, bg from <a href="http://ilovebanner.tumblr.com">ilb</a> and slider from <a href="http://things-to-help-you.tumblr.com/tagged/nivoslider">tthy</a>.

<NewerPosts><a style="float:left;" href="<$NewerPosts$>">◄ NEWER</a></NewerPosts>

<OlderPosts><a style="float:right;" href="<$OlderPosts$>">OLDER ►</a></OlderPosts>

</div>

</div></td>

<a href="/"><img src="http://i.imgur.com/qyZpI2x.png"

title="do you have a boy?"/></a>

<a href="/"><img src="http://i.imgur.com/D8IttgX.png"

title="hey yo, gg! here comes truble."></a>

<a href="/"><img src="http://i.imgur.com/weGKUTe.png"

title="express to london"></a>

</div></div>

<div style="margin-left:310px;width:240px;letter-spacing:1px;">Welcome to <b>YOURBLOGNAME</b>, here you will find this, this and this. I also do this, this and this so feel free to kiss me. Do not forget about blah blah and please do it it well and right. Yes, replace this box with a warm welcome message to your readers, thank you.

</div>

<div class="date"><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> / <a href="<$BlogItemPermalinkURL$>">permalink</a></div>

</blogger></div></div>

<div class="title">✔ About the blog</div><div class="date">Here comes trouble! </div>

Welcome to <i>YOURBLOGNAME</i>, here you will fidn everything you need and want. Manarie li que vaqeriao |at vver eos et accusam dignissum qui blandit est praesent luptatum delenit aigue excepteur sint occae. et harumd dereud facilis est er expedit distinct.t harumd dereud facilis est er expedit distinct. Excepteur sint occae. et harumd dereud facilis est er expedit distinct.t harumd dereud facilis est er expedit distinct. <b>Post here things and infos about your blog.</b>

</div>

<div class="title">♤ About the typist</div><div class="date"> Let me introduce myself!</div>

Hello, here is <i>YOURNAME</i> at your service. I'm actually 6teen and I live in w0nderland with my unicorns. Manarie li que vaqeriao |at vver eos et accusam dignissum qui blandit est praesent luptatum delenit aigue excepteur sint occae. et harumd dereud facilis est er expedit distinct.t harumd dereud facilis est er expedit distinct. at vver eos et accusam dignissum qui blandit est praesent luptatum delenit aigue excepteur sint occae. et harumd dereud facilis est er expedit distinct.t harumd dereud facilis est er expedit distinct. <b>Write something interesting about you.</b>

</div>

<div class="title">✙ Credits</div><div class="date">you really are something else!</div>

Feel free to delete this area if you want, this is just a way you can use to credit all the right persons on your blog without taking much space.<b>You can't remove the sidebar credits tho.</b><br><br>

<jess><a href="http://soojung.tk">Sunwoo (SUN) </a> Layout & colors</jess>

<jess><a href="/">Your name</a> Edition & posts</jess>

<jess><a href="/">Weheartit</a> Images</jess>

<jess><a href="/">Imgur</a> Images host</jess>

<jess><a href="/">Blogger</a> Blog host</jess>

</div>

</div></div>

<div class="title">✖ F.A.Q </div> <div class="date">I almost asked her what her new makeup was.</div>

<b>do you follow back?</b><br>

i do if i like your blog. please leave a link if you want me to check.<br><br>

<br>i'm 6teen right now.<br><br>

<b>how do you make skins? </b><br>

i have base codes made by me a time ago. i put it in a sideblog adn go customizing.<br><br>

<b>how do you make graphics/icons?</b><br>

i use photoshop cs6 and download textures here, here and here for edits, and download videos with vdownloader.<br><br>

my nickname is soondie but people used to call me sundi. you must call me sun thogh: i'm too shine.<br><br>

<b>you only like asian things?</b><br>

no, i have a open mind and i like meeting new cultures. i love russian and french stuff/culture.<br><br>

<b>sicne when are you kpopper?</b><br>

i met kpop with snsd's gee in early 2012 and i listened to 4minute, t ara, 2ne1 and miss a for a long time until a met f(x) when they was going to comeback with danger. you can say i'm kpopper sicne early 2011 though.<br><br>

<b>why don't you like exo/ifinite/b.a.p/b2st?</b><br>

whut<br><br>

</div>

</div></div>

<div class="title">♚ Fandoms & Likes</div> <div class="date">Let me put it down another way.</div>

<jess><a href="/">SNSD </a> hyoyeon, sooyoung, taeyeon, jessica, sunny, yoona, yuri, tiffany, seohyun</jess>

<jess><a href="/">B1A4</a> baro, sandeul, cnu, jinyoung, gonchan</jess>

<jess><a href="/">F(X)</a> amber, sulli, victoria, luna, krystal</jess>

<jess><a href="/">4MINUTE</a> jiyoon, jihyun, gayoon, hyuna, sohyun </jess>

<jess><a href="/">BLOCK B</a> zico, kyung, taeil, p.o, jaehyo, b bomb, u kwon</jess>

</div>

</div></div>

<div class="title">❝ Tagboard </div> <div class="date">When are you gonna come save me?</div><br>

<div id="aboy"><b> Tagboard warning and rules here. Feel free to delete this box tho.</b> Occae et harumb bet theap. est praesent luptatum. dignissum qui blandit est praesent luptatum delenit aigue excepteur sint occae. et harumd dereud facilis est er expedit distinct. et harumd dereud facilis est er expedit distinct. yoii rockem sockem mow-em yown. manarie li que vaqeriao.occae et harumb bet theap. est praesent luptatum.</div>

<center>/// Put your CBOX codes right here. MAX WIDTH 540-550PX ///</center>

</div></div>

<div class="title">☆ SKINS & PAGES </div> <div class="date">I got a boy handsome boy, who took all my heart</div><br>

<a class="stf" href="/">theme skin layout</a>

</div>

<a class="stf" href="/">theme skin layout</a>

</div>

<div class="title">☆ TUTORIALS </div> <div class="date">I got a boy, a handsome one! I got a boy, a kind one!</div><br>

<a class="stf" href="/">turorials</a>

</div>

<a class="stf" href="/">turorials</a>

</div><br><br><br><br>

<div class="title">☆ FREEBIES & EXTRAS </div> <div class="date">I got a boy awesome boy, I must have really fallen for him</div><br>

<a class="stf" href="/">freebies extras</a>

</div>

<a class="stf" href="/">freebies extras</a>

</div>

</div></div>

<div class="title">✿ Affiliates & Friends</div> <div class="date">Always next to me, it’s you, who’s on my side</div><br>

<div id="aboy"><b> Put here an affilitation/friends rules-warning, if you have any of course.</b> Occae et harumb bet theap. est praesent luptatum. dignissum qui blandit est praesent.</div><br>

<a href="/" class="aff">affiliate</a>

<a href="/" class="aff">affiliate</a><br>

<a href="/" class="aff">affiliate</a>

<a href="/" class="aff">affiliate</a><br>

<a href="/" class="aff">affiliate</a>

</div></div>

</td>

</tr></tbody></table></div></center>

</body></head></html>

A harmadik Design kódja:

<html>

<head>

<title>remember.</title>

#navbar-iframe { display: none; }

::selection { background: #F6D4CA; color: #FFF; }

::moz-selection { background: #F6D4CA; color: #FFF; }

body { font-family: trebuchet ms; font-size: 8pt; color: #555; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFOzSPdpGq5y1sF0LRbLMohYYvZuzX1cNElvmu5tFLkBeGTLut1l6JOyihnDMYhyphenhyphenBbKYv-Bkw_kWwuVC_Pra27pm8QcN9lkaI8y07rkettGkHwLvZezwW0jhzAnTIzOZPCcpixdkTFu1E/s1600/canvas+2.png); background-attachment: fixed; cursor: default; }

blockquote { background: rgba(246,212,202,0.1); padding: 10px; -webkit-transition: .3s; transition: .3s; -o-transition: .3s; -moz-transition: .3s; margin: 8px; border: 1px solid rgba(255,255,255,1); }

blockquote:hover { background: rgba(173,188,185,0.1); padding: 10px; border: 1px solid rgba(216,217,199,0.2); }

a { color: #ADBCB9; text-decoration: none; -webkit-transition: .3s; transition: .3s; -o-transition: .3s; -moz-transition: .3s; border-bottom: 1px dashed transparent; }

a:hover { color: #D8D9C7; border-bottom: 1px dashed #E9E3CD; }

#topbar { z-index: 9999; position: fixed; height: 110px; top: 0; left: 0; right: 0; padding: 15px; background: url(http://24.media.tumblr.com/tumblr_lq9nngeZ8j1qjex46o2_250.jpg); border-bottom: 10px solid #FFF; box-shadow: 0px 0px 7px #EAE4C0; margin-bottom: 10px; overflow: hidden; }

.top { background: rgba(255,255,255,0.75); border: 0px dashed #F6D4CA; float: left; margin-left: 50px; padding: 5px; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50%; width: 100px; z-index: 9999; display: block; }

.top img { display: inline-block; -moz-border-radius: 50px; -webkit-border-radius: 50px; -o-border-radius: 50%; -khtml-border-radius: 50%; border-radius: 50%; width: 100px; z-index: 9999; }

.desc { position: absolute; padding: 5px 5px 5px 30px; margin-left: -20px; top: 50px; background: rgba(255, 255, 255, 0.75); text-transform: uppercase; font-size: 16px; font-family: 'Yanone Kaffeesatz', sans-serif; letter-spacing: 2px; z-index: -20; margin-right: 10px; display: inline-block; }

.desc a, .navi { color: #eb9f89; padding: 5px; border: 0; -webkit-transition: .3s; -o-transition: .3s; -moz-transition: .3s; transition: .3s; }

.desc a:hover, .navi:hover { border: 0; background: #F6D4CA; color: #FFF; cursor: hand; }

.area { padding: 10px; background: rgba(255, 255, 255, 0.75); right: 20px; top: 20px; width: 400px; height: 70px; display: block; position: absolute; }

#center { margin: 180 auto; width: 530px; }

#container { width: 530px; position: absolute; }

#post { padding: 15px; background: #FFF; margin-bottom: 20px; }

#post img { opacity: .4; -webkit-transition: .4s; -o-transition: .4s; transition: .4s; -moz-transition: .4s; margin-bottom: 5px; }

#post img:hover { opacity: .7; }

.post-title { border-bottom: 1px solid rgba(233, 227, 205, 0.4); margin-bottom: 7px; padding-bottom: 5px; font-size: 21px; font-family: cambria; letter-spacing: 2px; color: #D8D9C7; font-style: italic; }

.post-title a { color: #D8D9C7; border-bottom: 0; -webkit-transition: .5s; }

.post-title a:hover { color: #E9E3CD; border-bottom: 0; }

#post .date { opacity: 0; filter: alpha (opacity=0); margin-top: -25px; -webkit-transition: .4s; transition: .4s; -o-transition: .4s; -moz-transition: .4s; font-family: trebuchet ms; text-transform: uppercase; letter-spacing: 2px; color: #F6D4CA; position: relative; z-index: 10; background: rgba(246, 212, 202, 0.1); width: 500px; padding: 7px 15px; left: -15px; bottom: -25px; }

#post:hover .date { opacity: 1; filter: alpha (opacity=0); bottom: -15px; }

.blogger-labels { margin-bottom: 15px; }

</style>

</head>

<body>

<span class="desc"><a href="/">home</a><span class="navi" onclick="document.getElementById('main').innerHTML=document.getElementById('profile').innerHTML">PROFILE</span><span class="navi" onclick="document.getElementById('main').innerHTML=document.getElementById('tags').innerHTML">TAGBOARD</span><span class="navi" onclick="document.getElementById('main').innerHTML=document.getElementById('creds').innerHTML">CREDITS</span><a href="http://tumblr.com">tumblr</a><a href="http://twitter.com">twitter</a><a href="http://www.blogger.com/follow-blog.g?blogID=<$blogID$>" target="_blank">follow</a></span>

hello! this is where you put a short introduction of your blog / your profile. not too long otherwise it'd overflow and make everything messy. not too short either or it won't look nice. adjust it to about this length (or just a <i>little</i> more) so that it fits the box nicely.</div></div>

layout 100% handcoded by <a href="http://blogskins.com/me/florals" target="_blank">florals</a> with inspiration from <a href="http://mochakari.com" target="_blank">kari</a> and <a href="http://latteu.blogspot.com" target="_blank">mae</a> and colours from <a href="http://www.colourlovers.com/palette/2230547/*_l_i_g_h_t_s_*" target="_blank">hana*</a>. the backgrounds can be found at <a href="http://fairycandlesxo.tumblr.com" target="_blank">fairycandles</a>.</div></div>

</div>

<BlogItemBody><$BlogItemBody$></BlogItemBody><div class="date">POSTED BY <$BlogOwnerFirstName$> <BlogDateHeader> ON <$BlogDateHeaderDate$></BlogDateHeader> @ <$BlogItemDateTime$></div></div></Blogger><div id="post"><center><OlderPosts><a href="<$OlderPosts$>">back</a> | </OlderPosts>all rights reserved desiree 2012<NewerPosts> | <a href="<$NewerPosts$>">forth</a></NewerPosts></center></div>

</body>

</html>

2014. augusztus 22., péntek

Teljes Design Kóddal #1

Az első Design kódja:

A második Design kódja:

A harmadik Design kódja:

Nincsenek megjegyzések:

Megjegyzés küldése