Na, viel Spaß:
- ein SVG:
<svg version="1.1" xmlns="http://www.w3.org/2000/svg">
<title>Whatsapp</title>
<desc>WA-Logo</desc>
<g viewBox="0 0 48 48" fill="#67C15E">
<path d="
M 23.99 0
C 10.76 0 0 10.76 0 23.99 C 0 29.24 1.69 34.11 4.57 38.06
L 1.57 46.98
L 10.80 44.03
C 14.59 46.54 19.12 48 24.00 48 C 37.23 48 48 37.23 48 24.00
C 48 10.76 37.23 0.00 24.00 0.00
L 23.99 0.00
L 23.99 0
Z" />
<path fill="white" d="
M 17.29 12.19
C 16.82 11.07 16.47 11.03 15.76 11.00 C 15.52 10.99 15.26 10.97 14.96 10.97
C 14.04 10.97 13.08 11.24 12.51 11.83 C 11.80 12.55 10.05 14.23 10.05 17.67
C 10.05 21.12 12.56 24.45 12.90 24.91 C 13.25 25.38 17.80 32.55 24.85 35.47
C 30.36 37.75 32.00 37.54 33.26 37.27 C 35.09 36.88 37.39 35.52 37.97 33.89
C 38.54 32.25 38.54 30.85 38.38 30.56 C 38.21 30.26 37.74 30.09 37.04 29.74
C 36.33 29.38 32.90 27.69 32.25 27.47 C 31.62 27.23 31.01 27.31 30.53 27.99
C 29.86 28.93 29.19 29.89 28.66 30.47 C 28.23 30.92 27.54 30.98 26.96 30.74
C 26.19 30.42 24.02 29.65 21.34 27.27 C 19.26 25.42 17.85 23.12 17.44 22.43
C 17.03 21.72 17.40 21.31 17.72 20.93 C 18.08 20.50 18.42 20.19 18.77 19.78
C 19.12 19.37 19.32 19.16 19.54 18.68 C 19.78 18.21 19.62 17.73 19.45 17.38
C 19.28 17.03 17.87 13.58 17.29 12.19
Z" />
</g>
</svg>
- etwas HTML
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style>
li { list-style-type: none; }
li::before, p::before {
display: inline-block;
content: url("…s.o.…");
min-width: 1ex; width: 10px;
min-height: 1em; height: 10px;
border: 1px solid red;
text-indent: 5em;
}
p::before {
width: 5em;
height: 5em;
}
</style>
</head>
<body>
<figure role="group"><img src=""…s.o.…" alt="WA-Logo"><figcaption>
Das SVG-WA-Logo
</figcaption>
<!-- Das SVG läßt sich also zeichnen! -->
</figure>
<p>Test. Test. Test.</p>
<ul><li> L-Test. L-Test. L-Test.</li><ul>
</html>
(Ach ja: das Logo wurde aus Platzgründen für hier etwas verstümmelt.)
Ich sehe da (es kommt mir hier aufs ::before
an!) immer nur gleich große Abbildungen. Die immer hübsch außerhalb ihrer Box stehen. Und: wie groß genau, dazu haben Firefox und Safari unterschiedliche Meinungen.