[解決済み] SVG ルート要素のデフォルトの背景色
2022-04-23 04:59:23
質問
SVGドキュメント全体のデフォルトの背景色を、例えば赤に設定したいのですが、可能でしょうか?
<svg viewBox="0 0 500 600" style="background: red">/* content */</svg>
上記の解決策は機能しますが、style 属性の background プロパティは残念ながら標準的なものではありません。 http://www.w3.org/TR/SVG/styling.html#SVGStylingProperties そのため、SVG Cleanerでクリーニングする際に削除されます。
この背景色を宣言する他の方法はあるのでしょうか?
どのように解決するのですか?
SVG 1.2 Tiny には ビューポートフィル 現時点ではほとんどのブラウザがSVG 1.1をターゲットにしているため、このプロパティがどの程度広く実装されているかは分かりませんが。Operaは実装しています(参考)。
現在のところ、よりクロスブラウザな解決策としては
<rect>
の最初の子として、幅と高さが 100% で fill="red" の要素を使用します。
<svg>
要素を例にとって説明します。
<rect width="100%" height="100%" fill="red"/>
関連
-
[解決済み】SVGオブジェクトの拡大縮小とミラーリング
-
[解決済み] d3.jsでノードのダブルクリックイベントを作成するにはどうすればよいですか?
-
[解決済み] SafariでSvg画像要素が表示されない
-
[解決済み] svg要素の色を変更するには?
-
[解決済み] Do I use <img>, <object>, or <embed> for SVG files?
-
[解決済み] SVGの塗りつぶし色の透明度/アルファ値?
-
[解決済み] CSSを使用してSVG画像の色を変更する方法(jQuery SVG image replacement)とは?
-
[解決済み] 背景画像として提供されるSVGイメージの塗りつぶし色を変更するには?
-
[解決済み】SVGファイル内のtransformを削除する方法
-
[解決済み] SVG ルート要素のデフォルトの背景色
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] D3.jsのsvgの背景色を設定する方法は?
-
[解決済み] d3.jsでノードのダブルクリックイベントを作成するにはどうすればよいですか?
-
[解決済み] getBBox() SVGRectはどのように計算するのですか?
-
[解決済み] SVGのストロークが一方向のみ
-
[解決済み] SafariでSvg画像要素が表示されない
-
[解決済み] ImageMagickでSVGをPNGに変換する方法は?
-
[解決済み】円弧(のSVGパス)を計算する方法)
-
[解決済み】SVGファイル内のtransformを削除する方法
-
[解決済み] SVGの円弧パスによる円形描画
-
[解決済み] svgのx属性とdx属性の違いは何ですか?