CSS3: Crear Circulo, Cuadrado, Triangulo en CSS

Yal Publicidad
Web master: Yuri Lizama
www.yalpublicidad.com/blog/ 

En ésta ocasión realizaremos un tarea simple, pero muy útil en diseño web. Hoy aprenderemos a crear círculos, cuadrados, rectangulos y otras figuras geométricas.

Círculo en CSS

<style type="text/css"> .circulo { width: 150px; height: 150px; background: #fa4657; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; } </style>

Cuadrado en CSS

<style type="text/css"> .cuadrado { width: 150px; height: 150px; background: #fa4657; } </style>

Triangulo en CSS

<style type="text/css"> .triangulo { width: 0; height: 0; border-right: 150px solid transparent; border-top: 150px solid transparent; border-left: 150px solid transparent; border-bottom: 150px solid #fa4657; } </style>



ENLACES RELACIONADOS

Texto con Sombra en CSS

Animaciones CSS Transitions