- #1
W
Webbie
Guest
Hallo,
Inspiriert von CSS-Werken wie CSS House, habe ich ein Bild erstellt, welches nur aus Buchstaben und Sonderzeichen besteht.
Mittels unterschiedlicher Größenangaben und relativer Positionierung der Zeichen entsteht ein Bild von zwei nebeneinander stehenden Figuren.
Kopiert einfach den Quelltext und speichert diesen z.B. mit dem Windows-Editor als HTML-Datei ab.
Falls ihr auch CSS-Bilder erstellen wollt oder schon welche erstellt habt, könnt ihr in diesem Thread einen Link zur entsprechenden Seite setzen oder wenn ihr wie ich keinen Speicherplatz habt, fügt ihr den Quelltext ein.
Buchstaben & Sonderzeichen
Das war mein letzter Beitrag im WinTotal Forum, da ich mich aus der Computer-Welt zurückziehen möchte, weil mir der Zeitaufwand einfach zu groß ist, aus dem sich ständig weiterentwickelnden PC- und Internet-Bereich immer neues Wissen anzueignen und dies auch zu behalten bzw. zu erweitern. Desweiteren habe ich auch keine Lust mehr dazu.
Nichts desto trotz gefällt mir euer Forum sehr gut und ich wünsche euch allen weiterhin viel Spaß und Freude mit WinTotal.
Viele Grüße, Webbie
Inspiriert von CSS-Werken wie CSS House, habe ich ein Bild erstellt, welches nur aus Buchstaben und Sonderzeichen besteht.
Mittels unterschiedlicher Größenangaben und relativer Positionierung der Zeichen entsteht ein Bild von zwei nebeneinander stehenden Figuren.
Kopiert einfach den Quelltext und speichert diesen z.B. mit dem Windows-Editor als HTML-Datei ab.
Falls ihr auch CSS-Bilder erstellen wollt oder schon welche erstellt habt, könnt ihr in diesem Thread einen Link zur entsprechenden Seite setzen oder wenn ihr wie ich keinen Speicherplatz habt, fügt ihr den Quelltext ein.
Buchstaben & Sonderzeichen
Code:
<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.1//EN
[url]http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd>[/url]
<html xmlns=[url]http://www.w3.org/1999/xhtml[/url] xml:lang=de>
<head>
<title>Buchstaben &amp; Sonderzeichen</title>
<meta http-equiv=content-type content=text/xml; charset=ISO-8859-1 />
<style type=text/css>
<!--
body {
background-color: rgb(255,255,255);
font-family: Verdana, sans-serif;
line-height: 1em;
}
/* ========== blaue Figur | linke Seite (L) ========== */
#frisur1L {
color: #96BEF0; /* rgb(150,190,240) */
position: relative;
top: 0.5em;
left: 1em;
font-size: 10em;
}
#frisur2L {
color: #96BEF0;
position: relative;
top: 0.4em;
left: 1.2em;
font-size: 10em;
}
#kopfL {
color: #96BEF0;
position: relative;
top: 0.9em;
left: 0.5em;
font-size: 15em;
}
#augenL {
color: #96BEF0;
position: relative;
top: 3em;
left: 2.7em;
font-size: 4em;
letter-spacing: 5px;
}
#pupillenL {
color: #96BEF0;
position: relative;
top: 3.15em;
left: 3.85em;
font-size: 3em;
letter-spacing: 18px;
}
#mundL {
color: #96BEF0;
position: relative;
top: 2.1em;
left: 1.7em;
font-size: 7em;
}
#rumpfL {
color: #96BEF0;
position: relative;
top: 1.4em;
left: 0.5em;
font-size: 15em;
}
/* ========== gruene Figur | rechte Seite (R) ========== */
#hut1R {
color: #8CD296; /* rgb(140,210,150) */
position: relative;
top: -0.6em;
left: 2.46em;
font-size: 10em;
}
#hut2R {
color: #8CD296;
position: relative;
top: -0.49em;
left: 2.34em;
font-size: 10em;
}
#kopfR {
color: #8CD296;
position: relative;
top: 0.45em;
left: 1.5em;
font-size: 15em;
}
#brillenglaeserR {
color: #8CD296;
position: relative;
top: 1.3em;
left: 6.35em;
font-size: 4em;
letter-spacing: 20px;;
}
#brillengestell1R {
color: #8CD296;
position: relative;
top: -0.7em;
left: 12.4em;
font-size: 2em;
letter-spacing: 86px;
}
#brillengestell2R {
color: #8CD296;
position: relative;
top: -0.75em;
left: 13.73em;
font-size: 2em;
}
#pupillenR {
color: #8CD296;
position: relative;
top: 1.8em;
left: 17.3em;
font-size: 1.5em;
letter-spacing: 45px;
}
#mundR {
color: #8CD296;
position: relative;
top: 1.1em;
left: 3.85em;
font-size: 7em;
}
#rumpfR {
color: #8CD296;
position: relative;
top: 0.94em;
left: 1.5em;
font-size: 15em;
}
-->
</style>
</head>
<body>
<!-- blaue Figur -->
<div id=kopfL>O</div>
<div id=augenL>&otilde;&otilde;</div>
<div id=mundL>-</div>
<div id=rumpfL>&Omega;</div>
<div id=pupillenL>&bull;&bull;</div>
<div id=frisur1L>&quot;</div>
<div id=frisur2L>&quot;</div>
<!-- gruene Figur -->
<div id=kopfR>O</div>
<div id=brillenglaeserR>oo</div>
<div id=mundR>-</div>
<div id=rumpfR>&Omega;</div>
<div id=pupillenR>&bull;&bull;</div>
<div id=hut1R>&Pi;</div>
<div id=hut2R>&mdash;</div>
<div id=brillengestell1R>\/</div>
<div id=brillengestell2R>&mdash;</div>
</body>
</html>
Das war mein letzter Beitrag im WinTotal Forum, da ich mich aus der Computer-Welt zurückziehen möchte, weil mir der Zeitaufwand einfach zu groß ist, aus dem sich ständig weiterentwickelnden PC- und Internet-Bereich immer neues Wissen anzueignen und dies auch zu behalten bzw. zu erweitern. Desweiteren habe ich auch keine Lust mehr dazu.
Nichts desto trotz gefällt mir euer Forum sehr gut und ich wünsche euch allen weiterhin viel Spaß und Freude mit WinTotal.
Viele Grüße, Webbie