时间戳

首页 > 解决方案 > 我怎样才能让这个 SVG 多边形“楔形”总是有 45 度的末端？

svg - 我怎样才能让这个 SVG 多边形“楔形”总是有 45 度的末端？

问题描述

我试图让这个楔形在两端都有 45 度角。

在此处输入图像描述

随着其包含的 div 的大小发生变化，或者页面被缩放，该角度也会发生变化：

在此处输入图像描述

这是我的（缩写）代码：

<div class="relative">
  <svg class="h-16p top-0 left-0 absolute w-full fill-current" viewBox="0 0 100 4" preserveAspectRatio="none">
    <polygon points="0,0 100,0 95,5 5,5" />
  </svg>
</div>

我正在使用tailwindCSS - 对于那些不熟悉这些类的人来说：

position: absolute;
width: 100%;
fill: currentColor;
height: 16px;
top: 0px;
left: 0px;

标签： svg

解决方案

推荐阅读