0

SVG ファイルをアイコンとして使用しているとします。外枠のある複雑な図面

<svg x="0" y="0"
  width="425.197px" height="425.197px" viewBox="0 0 425.197 425.197">
    <image id="logo" x="0" y="0" width="425.197px" height="425.197px" xlink:href="logo.svg"/>
    <image id="border" x="0" y="0" width="425.197px" height="425.197px" xlink:href="logo-border.svg"/>
</svg>

ホバー時に境界線を簡単に非表示にできます。

svg:hover image#border {
    display: none;
}

しかし、塗りつぶしの色を変更することはできません:

svg:hover image#logo {
    fill: #FFFFFF;
}

インポート方法 (オブジェクト、iframe などを使用) を変更する方法はありますか?

4

1 に答える 1

0

ホバーロジックを画像ファイル自体に配置すると、次のようになります...

#logo {
    fill: #FFFFFF;
}

そして、タグがポインターイベントを受信しないため、 anから and or orに変更します。<image><iframe><object><image>

基本的に、ビットマップ画像でできることを想像すると、SVG 画像でも同じことができます。png 画像や gif 画像はインタラクティブではないため、SVG 画像もインタラクティブではないため、画像の機能に関する頭の中での地図が損なわれることはありません。

于 2013-10-18T11:04:56.263 に答える