Caixa Flutuante no Blog

é só aqui ou vocês também estão vendo o cabeçalho bagunçado por causa dos anúncios que não dão para retirar?

Olá cerejeiras com amora!

hoje eu estava ando uma olhada em um blog que amo, o  Mell Creaciones e vi um tutorial bem legal que ela havia postado, então personalizei um pouco o código e trouxe pra cá, mais todos os créditos vão para esse blog :)

Bem, eu modifiquei e não ficou uma das melhores coisas, mais espero que gostem, vejam o preview, aqui está o preview do blog M.C, é eu sei, sou péssima em blogs de visualizações.

Vamos aprender?

♥Para adicioná-lo é fácil, abra um HTML / Javascript e cole:

<style>
.musMMC {
text-align:center;
font-size:11px;
font-family: trebuchet ms;
font-style: italic;
position: fixed;
left: 20px;
top: 10px;
width:150px;
color:#fff; /* COR DO TÍTULO */
border: 1px solid #8B3626; /* BORDA DO TÍTULO */
padding:4px;
border-radius: 10px;
background: #8B5742; /* FUNDO DO TÍTULO */
-webkit-transition: 2.0s;
-moz-transition: 2.0s;
}
.musMMC:hover {
-webkit-transition: 2.0s;
-moz-transition: 2.0s;
}
#note {
border-radius:10px;
border:1px solid #8B5742; /* BORDA DO BOX */
margin-top:820px;
width:180px;
margin-left:10px;
padding:4px;
position: fixed;
text-align:left;
background:#DB7093; /* FUNDO DO BOX */
color:#8B5742; /* COR DA LETRA DO BOX */
opacity: 0;
-webkit-transition: 2.0s;
-moz-transition: 2.0s;
}
.musMMC:hover #note {
margin-top:20px;
opacity: 1;
overflow:hidden;
-webkit-transition: 2.0s;
-moz-transition: 2.0s;}
</style>
<div class="musMMC">  TÍTULO <br /><div id="note">
ESCREVA ALGO AQUI<br />
AQUI O CÓDIGO DE ALGO, MENU, MUSIC BOX OU MENSAGEM.</div>
</div>

Bem, se não gostarem das cores, vocês podem modificá-las usando essa tabela, e se vocês quiserem as bordas como na visualização do M.C, é só substituir solid por dashed no código, e quanto a parte em negrito, vocês podem escrever uma saudação aos leitores e na parte em itálico, podem colocar um menu, ou music box, como explicado no código. Espero que tenham gostado do tutorial, foi mais útil do que o último que fiz não é?!