位置のようなSVGの位置付け：

Question

私は内側の要素をルート要素の内側に配置しようとしています。ルート要素は、100％の高さと100％の幅に設定されます。しかし、内側のsvgが外側のsvgの端から10px程度になるようにしたい - 右端を除くすべて、外側の右端から200pxになりたい。私はこれをWebブラウザーに表示したいので、ユーザーはブラウザと外側のsvgのサイズを変更できるはずですが、内側のsvgは両サイドの外側のsvgから正しい距離を維持できるはずです。このよう

：

+OUTER SVG------------------------------------------+ 
|             | 
| +INNER SVG----------------+     | 
| |       |     | 
| |       |  200px   | 
| |       | <---+-----+----> | 
| |       |     | 
| |       |     | 1 
| |       |     | 0 
| |       |     | 0 
| |       |     | % 
| |       |     | 
| |       |     | h 
| |       |     | i 
| +-------------------------+     | g 
|             | h 
|             | 
+---------------------------------------------------+ 
        100% Wide 

、それだけではSVGでこれを行うことは可能ですか？

Answer 1

私が正しくあなたを理解していれば、これは簡単です。 SVGは、Zスタック内に多くのビジュアル要素を持ち、整列され、重なっていても何でも構わない。

無料でオープンソースのInkscapeを使用してSVGを作成し、SVGの作成方法を見たい場合は、テキストエディタで直接編集できます。 Inkscapeでは、アライメントツール、グリッド、トランスフォームスケーリングツール、ドラッグアンドドロップ、そしてこれを実現するための他のツールを使用することができます。