css简单实现带箭头的边框
实现一个普通边框 <style> .border { width: 100px; height: 50px; border: 1px solid red; } </style> <div class="border"></div> web前端开发学习Q-q-u-n： 784783012 ，分享学习的方法和需要注意的小细节，不停更新最新的教程和学习方法 （详细的前端项目实战教学视频，PDF） 实现由四个三角形组成的正方形 <style> .triangle { width: 0; height: 0; border: 100px solid red; border-right-color: green; border-left-color: blue; border-top-color: black; } </style> <div class="triangle"></div> 三角形 <style> .triangle-bottom { width: 0; height: 0; border: 100px solid transparent; border-top-color: red; } </style> <div class="triangle-bottom"></div> 将左右下边颜色设置为透明 transparent，得到向下的箭头 将三角形放入边框中 <style>