css如何制作一个三角形

在电脑上打开网页编辑器，新建一个HTML页面，如图：

制作一个宽、高为0，边框为100px的正方形，如图：

然后给这个正方形的各个边框设置边框色，把其中一个边框色设置为blue，其他的设置为透明的，即：border-color:blue transparenttransparent transparent;代码如图：

用浏览器打开该页面，查看css绘制的三角形效果；点击页面单击鼠标右键，选择【查看元素】，打开浏览器的代码控制台，可查看当前网页源码，或代码调试。

由于ie6不支持transparent，所以没有透明效果，就需要把border-style：solid dashed dashed dashed；一个三角形就制作好了，如图：

将两个相邻的三角形拼在一起，也可以得到一个三角形。只要将正方形的两个相邻边框都设置成非透明色即可，代码如图：