Inicio »

Blog

Triángulos en CSS

Usando bordes transparentes, se pueden generar infinidad de formas usando css:

.multiborde {
border-color: green red blue orange;
border-style:solid;
border-width:20px;
width:0;
height:0;
}


.flechaiz {
border-color:transparent #000 transparent transparent;
border-style:solid;
border-width:10px 20px 10px 0;
width:0;
}


.flechader {
border-color:transparent transparent transparent #000;
border-style:solid;
border-width:10px 10px 10px 20px;
width:0;
}


.flechatop {
border-color:transparent transparent #000000;
border-style:solid;
border-width:0 13px 13px;
width:0;
}


.flechabot {
border-color:transparent transparent #000000;
border-style:solid;
border-width:0 13px 13px;
width:0;
}

Compartir:
  • del.icio.us
  • Facebook
  • Google
  • E-mail this story to a friend!
  • Live
  • StumbleUpon
  • Technorati
  • Tumblr
  • TwitThis
  • YahooMyWeb
  • LinkedIn

Un comentario para “Triángulos en CSS”

  1. alber dice:

    Hola muy interesante los triángulos en css pero no se ve correctamente en IE6.
    Ya sé que está obsoleto pero aún muchos millones de usuarios lo utilizan.

    Un saludo y gracias

Deja un comentario