用DIV+CSS可以作出很多不同形状的角形；以下我只写了几个；CSS没有优化；是为了让大家看得更清一些；
以下是一些小三角的形状：
这是第一个小三角的写法：
#com_a{border-top:10pxsolid#FFFFCC;border-left:10pxsolid#FF3300;border-bottom:10pxsolid#FFFFCC;}
以下是一些小三角；可以举一反三；做出更多的.
在线演示<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<title>www.zishu.cn</title>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<style>
/*zishu.cn*/
*{margin:0;padding:0;font-size:12px;font-family:Verdana,"宋体",Arial;line-height:1.8;list-style:none;}
#info,#nav{margin:50px;border:1pxdashed#FF3300;background:#FFFFCC;padding:50px;}
#infodiv{background:#FF0000;width:0px;height:0px;overflow:hidden;margin-bottom:10px;}
/*一些三角的写法*/
#com_a{border-top:10pxsolid#FFFFCC;border-left:10pxsolid#FF3300;border-bottom:10pxsolid#FFFFCC;}
#com_b{border-top:10pxsolid#FFFFCC;border-right:10pxsolid#FF3300;border-bottom:10pxsolid#FFFFCC;}
#com_c{border-top:10pxsolid#FFFFCC;border-right:10pxsolid#FF3300;border-bottom:10pxsolid#FFFFCC;border-left:10pxsolid#FF3300;}
#com_d{border-top:10pxsolid#FF3300;border-right:10pxsolid#FFFFCC;border-bottom:10pxsolid#FF3300;border-left:10pxsolid#FFFFCC;}
#com_e{border-top:10pxsolid#FFFFCC;border-left:10pxsolid#FF3300;}
#com_f{border-top:10pxsolid#FF3300;border-right:10pxsolid#FFFFCC;border-left:10pxsolid#FFFFCC;}
#com_g{border-right:10pxsolid#FFFFCC;border-bottom:10pxsolid#FF3300;border-left:10pxsolid#FFFFCC;}
#com_h{border-top:10pxsolid#FF3300;border-bottom:10pxsolid#FF3300;border-left:10pxsolid#FFFFCC;}
#com_i{border-top:10pxsolid#FF3300;border-right:10pxsolid#FF3300;border-bottom:10pxsolid#FF3300;border-left:10pxsolid#FFFFCC;}
</style>
</head>
<body>
<divid="info">
<h1>一些三角形的写法</h1>
<divid="com_a"></div>
<divid="com_b"></div>
<divid="com_f"></div>
<divid="com_g"></div>
<divid="com_c"></div>
<divid="com_d"></div>
<divid="com_e"></div>
<divid="com_h"></div>
<divid="com_i"></div>
</div>
</body>
</html>
以下是一个应用的实例
在线演示<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<title>www.zishu.cn</title>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<style>
/*zishu.cn*/
*{margin:0;padding:0;font-size:12px;font-family:Verdana,"宋体",Arial;line-height:1.8;list-style:none;}
#nav{margin:50px;border:1pxdashed#FF3300;background:#FFFFCC;padding:50px;}
a:link,a:visited{color:#FF6600;text-decoration:none;}
a:hover,a:active{color:#FF0000;}
#navaspan{overflow:hidden;border-top:6pxsolid#FFFFCC;border-left:6pxsolid#FFFFCC;border-bottom:6pxsolid#FFFFCC;height:0px;width:0px;margin:2px2px0-10px;position:absolute}
#nava:hoverspan{background:#CC3300;border-top:6pxsolid#FFFFCC;border-left:6pxsolid#FF3300;border-bottom:6pxsolid#FFFFCC;overflow:hidden;float:left;}
</style>
</head>
<body>
<divid="nav">
<h1>应用的一个实例</h1>
<ul>
<li><ahref="http://www.zishu.cn"target="_blank"><span></span>子鼠首页</a></li>
<li><ahref="http://www.zishu.cn"target="_blank"><span></span>给我留言</a></li>
<li><ahref="http://www.zishu.cn"target="_blank"><span></span>友情链接</a></li>
<li><ahref="http://www.zishu.cn"target="_blank"><span></span>我的日志</a></li>
<li><ahref="http://www.zishu.cn"target="_blank"><span></span>音乐英语</a></li>
</ul>
</div>
</body>
</html>
在IE6和IE7还有FIREFOX还有OPERA都测试过！IE6更低的版本没有测试！
原文地址：
http://www.zishu.cn/blogview.asp?logID=514经典论坛讨论：
http://bbs.blueidea.com/thread-2685234-1-1.html
相关推荐
这个“css小三角的做法与使用”主题深入探讨了如何仅通过CSS来创建各种形状的三角形，并且提供了文本文档和图解以帮助学习者理解。 首先，我们要了解CSS中如何创建三角形的基本原理。这是因为CSS边框不只可以是矩形...
* 转化后的图形与原三角形有什么联系？ * 组内展示交流：你是怎样操作的，得到什么样的结论 三、汇报操作验证结果 * 生上台展示：把一张三角形纸片的三个角向内对折，变成一个小长方形，得到长方形的长是原来...
首先，倍长中线是一种极为常见的辅助线做法。在三角形ABC中，如果线段AD是BC边的中线，那么将AD延长至点E，使得DE等于AD的长度，这时通过连接点B和E，我们得到了新的三角形ABE。通过对比原三角形ABC与新得到的三角形...
一个简单的做法是将三角形视为平面内的三条直线段，然后分别检查这些线段与AABB的边是否有交点。然而，这种方法效率较低，不适合大量物体的场景。Saildrp提出的快速判断算法则是基于几何特性，通过比较AABB的边界与...
杨辉三角，这一数学结构在计算机科学领域内有着广泛的应用，尤其在算法设计与分析、组合数学以及数据结构的学习中占据重要地位。杨辉三角，又称为“贾宪三角”、“帕斯卡三角”，是中国古代数学家杨辉于13世纪提出的...
翅膀通常由较小的三角插单元构成，以体现轻盈和飘逸的质感。 总的来说，三角插孔雀开屏的制作是一项需要创新思维、精细手工和耐心的艺术活动。通过熟练掌握三角插的基本技巧，结合颜色搭配和巧妙的设计，你可以创造...
【全等三角形常用辅助线做法】 在几何证明中，全等三角形的辅助线构建是解决问题的关键。这里我们探讨五种常用的方法，帮助学生更好地理解如何通过添加辅助线证明三角形全等。 1. **截长补短法**： 当我们需要...
在三角形中，如果一条线段是中线，那么倍长这条中线可以创建新的全等三角形，因为延长后的线段将与原边相等，形成两边及夹角对应相等（SSA）的情况，从而可能证明两个三角形全等。 例如，题目中的【方法1】和【方法...
教师引导孩子回忆之前的做法，然后让孩子尝试用这些蓝色三角形配对并组合成各种四边形。通过不同的组合方式，比如直角不等边三角形可以组合成正方形和平行四边形，孩子们的创造力和思维灵活性得到锻炼。 3. **教学...
为了处理这类约束，通常的做法是先生成全局的Delaunay三角网，然后再在特征线上选取合适的点重新生成三角网格，使得最终的三角剖分不仅满足Delaunay条件，同时也保留了特征线的信息。 #### 二、并行剖分算法 在生成...
本文将详细探讨如何使用C++语言来实现输出三角的方法。 首先，我们需要了解C++的基本语法和控制流结构。在这个示例中，我们主要会用到两种循环结构：`for`循环。`for`循环是C++中最常用的循环之一，它由初始化、...
5. **截长法与补短法**：若已知两个线段的和等于第三个线段，可以通过在其中一个线段上截取一段与第三个线段相等，或者将某个线段延长至与第三个线段相等，进而证明相关线段的关系。 6. **图形补全法**：对于包含60...
在处理角平分线时，要注意角平分线的性质，它能够将一个角分成两个相等的小角，这对于构造全等三角形非常有用。 在解决实际问题时，需要理解并熟练掌握这些方法，才能有效地证明几何题目中的各种关系。在教学过程中...
当线段长度关系难以直接证明时，可以采取截长（在较长线段上截取一部分等于较短线段）或补短（延长较短线段至与较长线段相等）的方法。这种方法可以帮助构造全等三角形，将分散的条件集中起来，便于证明。 6. **...
【全等三角形_辅助线做法讲义.doc】是一份关于几何问题中处理全等三角形的辅助线构造策略的文档。全等三角形是几何学中的基础概念，指的是两个三角形形状和大小完全相同，可以完全重合。在解决全等三角形问题时，...
例如，如果E和F分别是AB和AC上的点，且DE垂直于DF，D为中点，那么延长FD至K，使得DK=DF，通过证明⊿EDK≌⊿EFD，可以得到BE+CF与EF的关系。同样，若AD和AE分别是△ABC和△ABD的中线，且BA=BD，可以通过中位线性质...
全等三角形辅助线经典做法习题.doc