要实现一个使用CSS和<em>标签完成的三角形，我们需要理解CSS中边框属性的巧妙应用。在上述代码中，展示了如何通过设置<em>标签的边框来创建一个三角形。
我们需要定义一个列表，列表的每一项（<li>）中包含一个用于显示文本的<span>标签和一个<em>标签。在CSS中，我们设置了<em>标签的display属性为none，这意味着在没有鼠标悬停的状态下，三角形是不可见的。
接下来，我们为<a>标签设置了一个相对定位，使其成为<em>标签定位的参照物。当鼠标悬停在<a>标签上时，<em>标签的display属性变为block，使其显示出来。更重要的是，我们为<em>标签设置了四个方向的边框宽度不同，即上边框宽度为0，右边框宽度为6px，下边框宽度为6px，左边框宽度为6px。这样设置的结果是，边框的上边框因为宽度为0而不显示，右边、左边和下边框因为宽度相同而显示为一个等腰三角形的形状。
具体到CSS代码，<em>标签中的内容如下：
```css
#menua:hover em {
display: block;
overflow: hidden;
border: 6px solid #06a;
border-color: #06a #fff #fff #fff;
border-width: 6px 6px 0 6px;
position: absolute;
left: 50%;
top: 100%;
margin-left: -6px;
}
```
这里有几个关键点需要注意：
1. `display: block;` 使得<em>标签成为一个块级元素，这样才能够设置宽高和定位。
2. `overflow: hidden;` 防止边框因为溢出而显示不正常。
3. `border: 6px solid #06a;` 设置边框为6像素宽度的实线，颜色为#06a。
4. `border-color: #06a #fff #fff #fff;` 设置边框颜色，这里上边框颜色被设置为透明，以隐藏上边框，形成三角形的顶点。
5. `border-width: 6px 6px 0 6px;` 四个方向的边框宽度，其中上下边框宽度为0，左右边框宽度为6像素，这样左右边框会相交形成尖角。
6. `position: absolute;` 使<em>标签相对于其最近的已定位的祖先元素（本例中是:hover状态下的<a>标签）进行定位。
7. `left: 50%; top: 100%;` 使<em>标签位于其父元素的底部中心。
8. `margin-left: -6px;` 调整<em>标签的位置，使其尖角正好位于<a>标签的中心下方。
通过上述CSS设置，当鼠标悬停在列表项上时，一个由边框构成的三角形会从<em>标签中"弹出"，形成一个指向下的视觉效果。这种方法不使用任何图片，仅靠CSS的边框属性就能够创造出视觉上的三角形，是网页设计中的一种常用技巧。
