Como hacer un Triángulo con CSS

Para hacer un Triángulo ponemos un div en el html y en el css lo siguiente:

.triangulo{
    height: 0px;
    width: 0px;
    border-bottom: 200px solid black;
    border-right: 100px solid transparent;
    border-left: 100px solid transparent;
}

.triangulo Es el nombre de la clase.

La altura y la anchura de 0 px para poder modificar los bordes correctamente.

Si los border los ponemos todos del mismo color nos quedaría un cuadrado tal que así.

CSS:

Si le ponemos otros colores a los border-right y left nos queda así:

CSS:

Lo que tenemos que hacer ahora es poner los border-right y left transparentes :

CSS:

Si queremos poner un triángulo invertido, cambiamos el border-bottom por border-top:

CSS: