De una manera sencilla e ingeniosa: los bordes de una caja se unen en las esquinas formando un ángulo de 45 grados en ambas partes. Si pones un borde izquierdo rojo (por ejemplo), y un borde superior blanco, lo que verás será que el lado izquierdo termina arriba en 45 grados, porque el resto lo ocupa el borde superior blanco (sobre un fondo blanco, claro). Si ahora pones un borde inferior también blanco y no pones altura a la caja, el resultado será un borde izquierdo que termina en un ángulo de 45 grados arriba y abajo, es decir, una flecha.
Prueba esto:
HTML
CSS
Cita: #uno {width: 200px;border-top: 30px solid #f00;border-bottom: 30px solid #f00; border-left: 30px solid #00f;}
Invierto los colores para que veas el efecto, e imagina que pones los bordes superior e inferior blancos.
Supongo que se entenderá bien.