html - rect 的笔画不遵循 rect 的半径

Question

我有一个 svgrect元素，它使用rx: 5; ry: 5. 我不得不它stroke的宽度3。您是否可以看到stroke并没有真正遵循rect边界，它似乎不那么圆润：

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" baseProfile="full" width="300" height="86" viewBox="0 0 300 86" preserveAspectRatio="xMinYMin meet">
  <style>
    .ctn {
      x: 0;
      y: 0;
      rx: 5;
      ry: 5;
      fill: blue;
      stroke-width: 3;
      stroke: red;
    }
  </style>
  <rect width="300" height="86" class="ctn"/>
</svg>

有谁知道我怎样才能让它stroke遵循父母的半径？

标签： htmlcsssvgstroke