Warum werden meine SVGs im Internet Explorer nicht richtig skaliert?

SVGs werden im IE aufgrund fehlender Breite und Höhe nicht richtig skaliert

Bei dieser Frage stieß der Benutzer auf Skalierungsprobleme mit SVGs in Internet Explorer. Der Fehler entstand durch das Fehlen expliziter Breiten- und Höhenattribute in den SVGs.

Lösung: Bereitstellen von Breiten- und Höhenattributen

Um das Problem zu beheben, verwendete der Benutzer a Die von Nicolas Gallagher entdeckte Technik, bei der eine versteckte Element, um das erforderliche Seitenverhältnis für das SVG bereitzustellen.

Implementierung:

1. Fügen Sie ein -Element hinzu. -Element in den HTML-Code einfügen, wobei seine Breiten- und Höhenattribute so eingestellt sind, dass sie mit der SVG-Größe übereinstimmen.
2. Verstecken Sie das Verwenden Sie CSS, indem Sie die Sichtbarkeit auf „Ausgeblendet“ setzen.
3. Positionieren Sie das SVG absolut innerhalb des <div> unter Verwendung von CSS.

CSS:

canvas {
    display: block;
    width: 100%;
    visibility: hidden;
}

svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

HTML:

<div>

Durch Implementierung dieser Problemumgehung , der Benutzer hat das Skalierungsproblem im Internet Explorer erfolgreich gelöst, sodass die SVGs korrekt angezeigt werden können.

Das obige ist der detaillierte Inhalt vonWarum werden meine SVGs im Internet Explorer nicht richtig skaliert?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!