10 junio 2012

Efectos en el titulo del post!


Hola mis amores ^_^  Bueno hoy les traigo un tuto muy pedido que estoy segura que sera del agrado de muchas, hoy les enseño dos truquitos para personalizar el titulo de sus entradas, son efectos muy vistos en los blog mas populares  de la bloggosfera. hoy te enseño a crear un efecto deslizante o de expansión en ellos  así que haz click en lee mas y pon mucha atención!

Para comenzar debemos de buscar el codigo que establece los efectos cuando el cursor esta por encima del titulo de las entradas que es:

h3.post-title a:hover


Lo encontraras de esta manera:

h3.post-title a:hover{
text-decoration: underline;

Ahora vamos a los efectitos   y para colocarlos debes reemplazar el codigo de arriba por el codigo del efectito que elijas!!

1er efectito:

h3.post-title a:hover { text-decoration: line-through; color:#F307AC;/* Color del texto al pasar el cursor */ letter-spacing: 4px;



2do efectito:

h3.post-title a:hover { text-decoration: none; color:#F307AC;/* Color del texto al pasar el cursor */ letter-spacing: 4px;


Para cambiar el color del texto cuando pasa el cursor puedes utilizar una tabla de colores que la hallaras Aqui

Ahora si deseas que el titulo de la entrada tambien este en el centro busca:

h3.post-title {

codigo que estaria un poquito mas arriba del que buscamos anteriormente. Abajo de el coloca:
     
text-align:center


Por ultimo pero no menos importante  un premio que me lo a otorgado Kathy una chica locamente apasionada ;) pasen por su blog que en verdad es precioso a parte de adorable!!


Mi respuesta a su pregunta:
Que es lo mejor de tu vida?

 espero te haya gustado!! hasta la proxima.. 




30 comentarios:

  1. este tuto se le pedi ayer a una chica, y me salia pero en mayusculas el de hacerlas en grande, espero que este me salga, muchas gracias!!
    Suh, me gustaria pedirte un tuto, es el de redondear las esquinas del blog, lo vi en varios blogs y me gusto, sabes donde puedo encontrarle, o le puedes hacer? bueno besos y gracias por subir tutos se te da genial, te mereces mil premios mas :)

    ResponderEliminar
    Respuestas
    1. oyes Suh y si no me encuentra el h3.post-title a:hover?? que hago? besos y gracias otra vez

      Eliminar
    2. Yo pregunto lo mismo, a mi no me sale el h3.post-title a:hover sale solo: h3.post-title :/

      Eliminar
    3. Para hacer eso de las esquinas redondeadas vas a edicion html, buscas .content-inner {
      y le agregas
      -moz-border-radius: 35px;
      border-radius: 35px;
      border:1px solid #000000;

      Eso es todo, besos :)

      Eliminar
    4. holaaa,solo tienen que hacer lo mismo, ya sea q les aparesza h3.post-title o de la forma que explica en el post. es lo mismo. saludos.
      http://mycieldecristal.blogspot.com.ar/#

      Eliminar
  2. buen esta el tuto...!! pues gracias por participar...pero casi que casi le atinas..asi que si alguien no le acierta pues sera tu la ganadora que estubo mas cerca..!!
    no puse pistas porque si los ponia talvez muuchas personas hubieran acertado..y bueno me parecio mas divertido si no ponia opciones...!!

    gracias por seguirme y haber leido cada una de mis entradas en todo este año..!!

    ResponderEliminar
  3. Ay va! Pues como mola eh? Esta genial, me ha encantado tu blog, creo que me quedaré por aqui, que veo muchas cositas interesantes *-*
    Besitos!!

    ResponderEliminar
  4. Esta muy bueno el dato! apenas pueda lo aplicare a mi blog :)
    Cuidate besos.

    ResponderEliminar
  5. Hoolis por aqui! Suh muy bueno esto pero no encuentro eso que dices, solo sale h3.post-title
    Me ayudas porfis?
    Felicitaciones por el premio! ^^

    ResponderEliminar
  6. -Hehe buen tuto! ^.^ Exacto buscaba algo para poner el titulo de la entrada al texto, vere si me funciona solo con el ultimo codigo :p

    Pd. Hehe sobre mi entrada, la respuesta es si. Hehe, fue un dia que desidimos no entrar a clases y mejor irnos de 'pinta', ademas de que me la pase genial junto a el todo el dia, ya para la noche me dijo eso... pff! Como olvidar ese dia! ^_^ Hehe y que tu novio 'planee', hehe igual me pasa. Aveces no se que haria sin el hehe.
    Espero no haberte aburrido con mi comentario tan largo xD

    ResponderEliminar
  7. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  8. No esta bien formada entonces jeje, pero ahí me las ingenie, gracias por la ayuda ^^ la cosa es que el centrado en el titulo eso si que no pude, es que el código que dices no aparece :/

    ResponderEliminar
  9. Pues mira, es algoq ue había buscado varias veces pero no había encontrado. La posibilidad de cambiar los títulos de los post.
    Mil gracias!!
    Besos

    ResponderEliminar
  10. Hayy que chulisimoo, me lo voy apuntar por si un día me da por poner título!
    GRACIAS
    un beso!

    ResponderEliminar
  11. Hola LInda!!!, gracias por haverte pasado por mi blogie!!!
    Me encanta lo que veo por aca...nos seguimos leyendo.!!! un besote xD

    ResponderEliminar
  12. Que guaay!! Gracias por tuto! :) Yo siempre quiero personalizar mi blog pero nunca sé que hacerle >.< jajajajaja estaré atenta a tus consejos, un besitoo!! :D

    ResponderEliminar
  13. Precioso tutorial *-*
    Una cosa más para empezar a personalizar mi blog, que esta un poco cutre >.<
    Me encantan tus tutos =D

    Muchos besitos!!

    ResponderEliminar
  14. ¿podrias hacer el tuto de como cambiar el diseño de los comentarios??

    ResponderEliminar
  15. ^^ Acabo de encontrar tu blog
    pero dejame decirte que es hermoso!!!
    Y mil gracias por poner todos estos
    tutoriales, me has salvado ^^
    Xoxo **

    ResponderEliminar
  16. Muchas,Muchas gracias aquí esta mi blog para que lo visites ¡Me eres de mucha ayuda! http://miamisticos.blogspot.com.ar/

    ResponderEliminar
  17. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
    Respuestas
    1. perdon por mi comentario anterior... soy tan despistada que recien me acabo de dar cuenta! ¡Besitos Chuli!

      Eliminar
  18. Soy algo nuevita en esto y queria preguntarte a que le llaman post ¿a las publicaciones?

    ResponderEliminar
  19. hola bonita :)) una super preguntota... no me sale lo de ''h3.post-title a:hover'' solo me sale ''h3.post-title'' pero me salen dos :( cual puede ser? buena vibraa

    ResponderEliminar
  20. coco ayuda, yo tenia letra caligrafitty en el titulo de la entrada, le puse un defecto y no me agrado mucho. despues lo intente quietar y ya no me aparece la misma letra cursiva, que hago :(

    ResponderEliminar
  21. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  22. Hola me encantan tus tutos , pero soy principiante y no puedo encontrar en el html h3.post-title a:hover busque renglon por renglon y no lo puedo encontrar

    ResponderEliminar

========================S2============================
Solo habla si te interesa! y se cordial. Si no te gusta no me lo hagas
saber pues hieres mis sentimientos y yo publico para ti y para los demás
lectores así que no seas mala leche.
========================S2============================