BinaryDevelop
  1. ホーム
  2. css

[解決済み] svgの円のダブルストロークの色

2022-02-12 16:58:33

質問

ストロークのみ、フィルなしで円を作るには、このようにします。 

fill: none !important;
stroke-width: 1px;
  • ダブルストロークにしたい。

どのように解決するのですか？

悲しいかな、SVGにダブルストロークを設定することはできず、破線か実線のストロークしか設定できません。

その代わりに、まったく同じ要素を作成し、必要な分だけサイズや半径を小さくしてください。 

.circle {
  fill: none;
  stroke: black;
}

<svg height="100" width="100">
  <circle class="circle" cx="50" cy="50" r="40" stroke-width="1" />
  <circle class="circle" cx="50" cy="50" r="38" stroke-width="1" />
</svg>

関連

最新

おすすめ

について
/
プライバシー・ポリシー
/
お問い合わせ
© 2022 BinaryDevelop. すべての権利は、それぞれの所有者に帰属します