Als «svg» getaggte Fragen

Scalable Vector Graphics (SVG) ist ein XML-basiertes zweidimensionales Vektorgrafikformat, das auch in HTML verwendet werden kann. Fügen Sie dieses Tag nicht hinzu, nur weil Ihr Projekt SVG verwendet. Fügen Sie stattdessen das Tag hinzu, wenn Ihre Frage entweder SVG betrifft oder eng damit zusammenhängt, z. B. wie Sie mit SVG etwas erreichen können.

6
Wie verwende ich das Attribut <svg> viewBox?
Ich lerne svg aus seinen offiziellen Dokumenten, es gibt eine solche Linie. Ich verstehe es nicht, wenn es bereits ein widthund height-Attribut hat, wozu soll es dann noch einmal angegeben werden viewBox="0 0 1500 1000"? Es heißt: "Eine px-Einheit ist so definiert, dass sie einer Benutzereinheit entspricht. Daher entspricht eine …
73 svg 
2
VectorDrawable in SVG konvertieren [geschlossen]
Geschlossen. Diese Frage entspricht nicht den Richtlinien für Stapelüberlauf . Derzeit werden keine Antworten akzeptiert. Möchten Sie diese Frage verbessern? Aktualisieren Sie die Frage so dass es beim Thema für Stack - Überlauf. Geschlossen vor 3 Jahren . Verbessere diese Frage Ich habe die entgegengesetzten Konvertierungen (SVG zu VectorDrawable) manuell …
2
Text in SVG ausrichten
Ich versuche, SVG-XML-Dokumente mit einer Mischung aus Zeilen und kurzen Textausschnitten (normalerweise zwei oder drei Wörter) zu erstellen. Das Hauptproblem, das ich habe, besteht darin, den Text an Liniensegmenten auszurichten. Für die horizontale Ausrichtung kann ich text-anchormit left, middleoder right. Ich kann kein Äquivalent für die vertikale Ausrichtung finden. alignment-baselinescheint …
70 xml  svg 
6
SVG zu Android Shape [geschlossen]
Diese Frage passt derzeit nicht zu unserem Q &amp; A-Format. Wir erwarten, dass die Antworten durch Fakten, Referenzen oder Fachwissen gestützt werden, aber diese Frage wird wahrscheinlich zu Debatten, Argumenten, Umfragen oder erweiterten Diskussionen führen. Wenn Sie der Meinung sind, dass diese Frage verbessert und möglicherweise erneut geöffnet werden kann, …
2
Wie füge ich ein Symbol für großartige Schriftarten in mein SVG ein?
Ich habe eine SVG, die Bilder enthält: &lt;g&gt;&lt;image id="myImage" class="myClass" x="12" y="15" width="10" height="10" xlink:href="/images/pic.png"/&gt;&lt;/g&gt; Wie ersetze ich diese Zeile mit einem fantastischen Symbol für Schriftarten: &lt;g&gt;&lt;i class="icon icon-cloud-download" x="12" y="15" width="10" height="10"&gt;&lt;/i&gt;&lt;/g&gt; scheint nicht zu funktionieren, da das Bild nicht angezeigt wird.
70 css  svg  font-awesome 
9
Erstellen Sie ein Blitzdesign (wie The Flash)
Overа этот вопрос есть ответы на Stapelüberlauf на русском : Создайте дизайн молнии Ich versuche, das Blitzsymbol aus The Flash (DC Comics) (oder dem T-Shirt von Sheldon Cooper von Big Bang Theory ) in CSS neu zu erstellen . Dies wird sich wie ein Sternebewertungssystem verhalten, stattdessen nur wie ein …
69 html  css  svg  css-shapes 
6
Pfeile über HTML zeichnen
Ich habe eine HTML-Tabelle und möchte einen Pfeil von einer Zelle zu einer anderen Zelle zeichnen. Zum Beispiel so: Wie könnte das gemacht werden? Beispiel HTML: &lt;html&gt; &lt;body&gt; &lt;table&gt; &lt;tr&gt;&lt;td&gt;0&lt;/td&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;td&gt;4&lt;/td&gt;&lt;td&gt;5&lt;/td&gt;&lt;td&gt;6&lt;/td&gt;&lt;td&gt;7&lt;/td&gt;&lt;td&gt;8&lt;/td&gt;&lt;td id="end"&gt;9&lt;/td&gt;&lt;tr&gt; &lt;tr&gt;&lt;td&gt;0&lt;/td&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;td&gt;4&lt;/td&gt;&lt;td&gt;5&lt;/td&gt;&lt;td&gt;6&lt;/td&gt;&lt;td&gt;7&lt;/td&gt;&lt;td&gt;8&lt;/td&gt;&lt;td&gt;9&lt;/td&gt;&lt;tr&gt; &lt;tr&gt;&lt;td&gt;0&lt;/td&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;td&gt;4&lt;/td&gt;&lt;td&gt;5&lt;/td&gt;&lt;td&gt;6&lt;/td&gt;&lt;td&gt;7&lt;/td&gt;&lt;td&gt;8&lt;/td&gt;&lt;td&gt;9&lt;/td&gt;&lt;tr&gt; &lt;tr&gt;&lt;td&gt;0&lt;/td&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;td&gt;4&lt;/td&gt;&lt;td&gt;5&lt;/td&gt;&lt;td&gt;6&lt;/td&gt;&lt;td&gt;7&lt;/td&gt;&lt;td&gt;8&lt;/td&gt;&lt;td&gt;9&lt;/td&gt;&lt;tr&gt; &lt;tr&gt;&lt;td&gt;0&lt;/td&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;td&gt;4&lt;/td&gt;&lt;td&gt;5&lt;/td&gt;&lt;td&gt;6&lt;/td&gt;&lt;td&gt;7&lt;/td&gt;&lt;td&gt;8&lt;/td&gt;&lt;td&gt;9&lt;/td&gt;&lt;tr&gt; &lt;tr&gt;&lt;td&gt;0&lt;/td&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;td&gt;4&lt;/td&gt;&lt;td&gt;5&lt;/td&gt;&lt;td&gt;6&lt;/td&gt;&lt;td&gt;7&lt;/td&gt;&lt;td&gt;8&lt;/td&gt;&lt;td&gt;9&lt;/td&gt;&lt;tr&gt; &lt;tr&gt;&lt;td&gt;0&lt;/td&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;td&gt;4&lt;/td&gt;&lt;td&gt;5&lt;/td&gt;&lt;td&gt;6&lt;/td&gt;&lt;td&gt;7&lt;/td&gt;&lt;td&gt;8&lt;/td&gt;&lt;td&gt;9&lt;/td&gt;&lt;tr&gt; &lt;tr&gt;&lt;td&gt;0&lt;/td&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;td&gt;4&lt;/td&gt;&lt;td&gt;5&lt;/td&gt;&lt;td&gt;6&lt;/td&gt;&lt;td&gt;7&lt;/td&gt;&lt;td&gt;8&lt;/td&gt;&lt;td&gt;9&lt;/td&gt;&lt;tr&gt; &lt;tr&gt;&lt;td&gt;0&lt;/td&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;td&gt;4&lt;/td&gt;&lt;td&gt;5&lt;/td&gt;&lt;td&gt;6&lt;/td&gt;&lt;td&gt;7&lt;/td&gt;&lt;td&gt;8&lt;/td&gt;&lt;td&gt;9&lt;/td&gt;&lt;tr&gt; &lt;tr&gt;&lt;td id="start"&gt;0&lt;/td&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;td&gt;4&lt;/td&gt;&lt;td&gt;5&lt;/td&gt;&lt;td&gt;6&lt;/td&gt;&lt;td&gt;7&lt;/td&gt;&lt;td&gt;8&lt;/td&gt;&lt;td&gt;9&lt;/td&gt;&lt;tr&gt; &lt;/body&gt; &lt;/html&gt; Wenn Sie die Größe des Browsers ändern, …
13 javascript  html  svg 
2
Android-Begrüßungsbildschirm VectorDrawable
Ich möchte ein VectorDrawable in meinem Begrüßungsbildschirm anzeigen &lt;?xml version="1.0" encoding="utf-8"?&gt; &lt;layer-list xmlns:android="http://schemas.android.com/apk/res/android"&gt; &lt;item android:drawable="@android:color/white" android:gravity="fill" /&gt; &lt;item android:drawable="@drawable/splash_screen" android:gravity="bottom|center" /&gt; &lt;/layer-list&gt; Mein SVG hat android:width="320dp"undandroid:height="238dp" &lt;vector xmlns:android="http://schemas.android.com/apk/res/android" android:width="320dp" android:height="238dp" android:viewportWidth="320" android:viewportHeight="238"&gt; &lt;group&gt; &lt;clip-path android:pathData="M0,0h320v238h-320z M 0,0"/&gt; &lt;path android:pathData="M0,143.311a160,4.476 0,1 0,320 0a160,4.476 0,1 0,-320 0z" android:fillColor="#E6E6E6"/&gt; &lt;path android:pathData="M245.269,94.815C245.067,94.818 244.865,94.821 244.66,94.821C244.455,94.821 …
2
SVG CSS Mehrere Animationen
Ich habe eine Schatzkartenanimation erstellt. Zuerst wird der Pfad in Hellgrau angezeigt. Zu Beginn der Animation möchte ich jedoch, dass die hellgrauen Striche verschwinden oder sich in eine schwarze Farbe verwandeln, wenn die Füllanimation ".road" aktiviert wird Probleme damit, dass die hellgrauen Striche ".steps" verschwinden, wenn die Füllanimationen über diese …
9 css  svg 
2
Wie kann ich die Größe des ClipPath-Bereichs von SVG ändern?
Ich habe einen solchen Code: .img-container { width: 300px; height: 300px; background-color: lightgreen; overflow: hidden; } .clipped-img { clip-path: url('#header-clip-svg'); } &lt;div class="img-container"&gt; &lt;!--clipping SVG--&gt; &lt;svg height="0" width="0"&gt; &lt;defs&gt; &lt;clipPath id="header-clip-svg"&gt; &lt;path d="M199.6,18.9c-4.3-8.9-12.5-16.4-22.3-17.8c-11.9-1.7-23.1,5.4-32.2,13.2c-9.1,7.8-17.8,16.8-29.3,20.3c-20.5,6.2-41.7-7.4-63.1-7.5C38.7,27,24.8,33,15.2,43.3c-35.5,38.2-0.1,99.4,40.6,116.2c32.8,13.6,72.1,5.9,100.9-15c27.4-19.9,44.3-54.9,47.4-88.6c0.2-2.7,0.4-5.3,0.5-7.9C204.8,38,203.9,27.8,199.6,18.9z"&gt;&lt;/path&gt; &lt;/clipPath&gt; &lt;/defs&gt; &lt;/svg&gt; &lt;!-- clipped image--&gt; &lt;img class="clipped-img" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/3341051/team.jpg"/&gt; &lt;/div&gt; Führen Sie das Code-Snippet ausErgebnisse ausblendenErweitern Sie …
8 css  svg  clip-path 
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.