Como poner un borde redondeado

17 abril 2015


Borde redondeado blog



Hay veces que las cosas son mas difíciles de lo que parecen pero siempre podemos encontrar ayudas que nos hacen la vida mas fácil e incluso nos ayudan a comprender el complicado lenguaje del Html.

Hoy os voy a enseñar a poner bordes redondeados a la plantilla de vuestra blog pero con la ayuda de la pagina Border-Radius, que no es mas que un generador de código para ayudarnos a obtener nuestros bordes redondeados.

Es una web muy sencilla como veis en la siguiente imagen, lo único que tenéis que hacer es elegir la numeración en pixeles que queréis para cada una de las esquinas, donde 0 seria un angulo recto y cuanto mas redondeado lo queráis solo tendréis que ir incrementando la cantidad, y a la vez os va ir generando el código que necesitáis, para obtener el mismo resultado en vuestro blog.


Borde redondeado blog



Ahora solo nos quedaría entrar a la plantilla de nuestro blog y buscar lo siguiente:


.content-inner {


Justo debajo copiaremos el código que hemos obtenido, pero nos queda un paso mas que necesitamos  para definir el grosor, el estilo y el color de la linea que tendrá nuestro borde.


border: 5px solid grey;


Esta linea la colocaremos justo debajo del código que hemos pegado antes y ademas la podemos personalizar a nuestro gusto en función de la paleta de colores que tenga nuestro blog.

  5px: seria el grosor de la linea
 solid: el estilo de linea en este caso se trata de una linea continua.
 grey: el color que podemos indicarlo mediante su código si lo sabemos o a través del nombre color pero siempre en ingles.

Como siempre espero que os haya sido útil y como siempre digo tienes el mail para cualquier duda que os surja. ;)


6 comentarios

  1. Gracias por compartir, Border-Radius

    ResponderEliminar
  2. Este comentario ha sido eliminado por un administrador del blog.

    ResponderEliminar
  3. Hola...estoy diseñando mi blog por primera vez y te agradezco muchísimo esta información, no tengo ni idea de programación, pero lo he conseguido...¡bordes redondeados!!

    ResponderEliminar