Status Box vers 1

Assalamu'alaikum~

Thanks for Maya :) Ini tutorial dapet dari blog dia~

Preview :

Classic Template :

• 
• Copy kode yang Salsa sediakan, lalu paste-kan di kolom Html/JavaScript tadi.

Blogskin :

• Dashboard > Template > Search kode </style>
• Copy kode yang Salsa sediakan, lalu paste-kan dibawah kode </style>.

Codes :

<style>

#line{

position:fixed;

right:50px;

top:0px;

border-left:10px solid #ffd2e0;

border-right:10px solid #ffd2e0;

width:70px;

height:50px;}

.statioo {

border:1px solid #ffd2e0;

font-family:  'GFS Neohellenic', sans-serif;

font-size:13px;

letter-spacing:2px;

-webkit-transition:All 0.4s ease;

-moz-transition:All 0.4s ease;

-o-transition:All 0.4s ease;color:#000;

width:150px;

margin-left:-38px;

margin-top:40px;

text-align:center;

padding:5px;

background:url(Url Background);

}

#notii {

border:1px solid #ffd2e0;

width:150px;

font-family:  'GFS Neohellenic', sans-serif;

font-size:13px;margin-top:10px;

margin-left:-38px;

padding:4px;

height:%0px;

text-align:left;

background:url(Url Background);

color:#444;

-webkit-transition: 1.0s;

-moz-transition: 1.0s;}

</style>

<div id="line">

<div class="statioo">

STATUS</div>

<div id="notii">

YOUR TEXT</div>

</div></div>

    Adjust code :
- Merah : posisi status box.
-  Hijau : border status box, bisa diganti dengan (dashed, double, dotted, etc.)
- Oranye : kode warna border.
- Biru : font status box.
- Aqua : Url background.
- Ungu : kode warna font status box.
- Pink : Judul status box dan Isi status box. Email ThisBlogThis!Share to XShare to FacebookShare to Pinterest