在网易首页头部的菜单栏，会有一个三角形这样
当鼠标通过时，三角形将垂直翻转，如下所示
现在我和大家分享三角形的制作方法，主要是用边框做的。
首先，将四个三角形组合成一个正方形，即由正方形的四个边组成的四个三角形。
源代码：
xml代码将内容复制到剪贴板。
广场
div {。
宽度：0px；
身高：0px；
边境上：50px固体红；
底部边框：50px固体绿；
左边界：50px固体黄；
边境：50px固蓝；
注意：四边框的宽度必须相同！* /
}
结果如下：
现在，拿一个三角形，实际上是隐藏其他三角形。
源代码：
xml代码将内容复制到剪贴板。
制作一个三角形箭头
箭{。
宽度：0；
身高：0；
边境上：50px固体# 000； / * * /设置和显示的边界
边框底部：无； *不设置边框。
左边界：50px固体透明； / / *但隐藏左边界
边境：50px固体透明； / / *但隐藏右边界
}
箭头：悬停{
边框顶部：无；鼠标后，不要设置在边框上。
底部边框：50px固体# 000； / *后鼠标，设置和显示下一帧。
}
结果如下：
接下来，我共享一个按钮。
它主要由边框样式、框阴影和伪类效应实现。
源代码：
xml代码将内容复制到剪贴板。
CSS制作按钮
- {。
宽度：100px；
身高：100px；
背景：# CCC；
边框半径：50%；
盒子的影子：5px 5px 10px # 000； / * * /设置一个阴影
}
注：主动{。
背景：# BBB；
盒子的影子：5px 5px 10px # 000插图； / * * /设置阴影
}
{ BTN div。
字体大小：30px；
字体微软雅黑；
颜色：蓝色；
浮点数：左；
边距：28px；
左：20px保证金；
}
开始
uff1a效应
效果可能不是很漂亮，要推广，大家都可以发挥自己的想象力，取得更好的成绩，祝大家学习愉快！
以上是一个简单的三角形按钮使CSS的例子，这是所有萧边分享你的内容。我希望能给你一个参考，希望你能支持它。
