W3Schools Tryit 编辑器 - W3Schools 中文教程

获取您自己的网站

<!DOCTYPE html>
<html>
<body>

<h2>SVG stroke-linejoin attribute</h2>

<svg width="600" height="230" xmlns="http://www.w3.org/2000/svg">
  <polygon points="55,25 10,190 110,190" fill="lime" stroke="red" stroke-width="16" stroke-linejoin="round" />
  <rect width="150" height="100" x="140" y="50" fill="yellow" stroke="red" stroke-width="16" stroke-linejoin="round" />
  Sorry, your browser does not support inline SVG.
</svg>

<svg width="600" height="230" xmlns="http://www.w3.org/2000/svg">
  <polygon points="55,25 10,190 110,190" fill="lime" stroke="red" stroke-width="16" stroke-linejoin="miter" />
  <rect width="150" height="100" x="140" y="50" fill="yellow" stroke="red" stroke-width="16" stroke-linejoin="miter" />
  Sorry, your browser does not support inline SVG.
</svg>

<svg width="600" height="230" xmlns="http://www.w3.org/2000/svg">
  <polygon points="55,25 10,190 110,190" fill="lime" stroke="red" stroke-width="16" stroke-linejoin="bevel" />
  <rect width="150" height="100" x="140" y="50" fill="yellow" stroke="red" stroke-width="16" stroke-linejoin="bevel" />
  Sorry, your browser does not support inline SVG.
</svg>
 
</body>
</html>