svg实现直线带右箭头
时间：2023-05-05 17:19:30 阅读：261473 作者：636
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>svg实现直线带右箭头</title> <style> * { margin: 0; padding: 0; box-sizing: border-box; /*保证盒子的大小不会因为padding值的影响而变大。默认情况下padding的值会影响盒子的大小*/ } html, body { width: 100%; height: 100%; background: lightblue; /*背景图片同窗口完全自适应*/ background-size: 100% 100%; /*去除页面的滚动条*/ overflow: hidden; } #box { width: 20%; height: 2.5%; /*border: yellow solid 1px;*/ margin-left: 30%; margin-top: 20%; } #svg14 { height: 100%; width: 100%; overflow: hidden; } #polygon14 { fill: black; stroke-width: 1; stroke: red; } </style></head><body><div id="box"> <svg id="svg14" viewBox="0 0 305 15" preserveaspectratio='none'> <polygon id="polygon14" points='1,7 300,7 295,1 304,7 295,14 300,7 ' /> </svg></div></body></html>
版权声明：该文观点仅代表作者本人。处理文章：请发送邮件至 三1五14八八95#扣扣.com 举报，一经查实，本站将立刻删除。