StartseiteMitgliederAnmeldenLogin


Teilen | .
 

 Vorlage ~ Beziehungen

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach unten 
AutorNachricht
The Guardian
possessed by a demon
avatar


BeitragThema: Vorlage ~ Beziehungen   Fr Apr 19, 2013 2:01 am




Name/Spruch


Familie

MUTTER: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores.

VATER: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores.


Freunde


Bekannte


Schwärmereien & Geliebte


Gehasste


Vergangenheit





Code:
<center><link href='http://fonts.googleapis.com/css?family=Cabin+Sketch:700' rel='stylesheet' type='text/css'><link href='http://fonts.googleapis.com/css?family=Abel' rel='stylesheet' type='text/css'><link href='http://fonts.googleapis.com/css?family=Codystar' rel='stylesheet' type='text/css'><style text="text/css"> .box {font-family: 'Abel', sans-serif; font-size: 14px; text-align: justify; width:450px; padding: 15px 15px; background-color: #000000; border-right: 10px solid #597699; border-left: 10px solid #597699; } .nameabc {font-family: 'Cabin Sketch', cursive; font-size: 50px; text-align: center; margin-top: 10px; line-height: 95%;} .head {font-family: 'Codystar', cursive; font-size: 20px; text-align: left; border-bottom: 1px solid grey;} .head2 {font-family: 'Codystar', cursive; font-size: 20px; text-align: right; border-bottom: 1px solid grey;}</style>

<div class="box"><img src="http://imageshack.us/a/img845/7370/rtam.jpg" width="450px">
<div class="nameabc">Name/Spruch</div>

<div class="head">Familie</div>
<img style="float: left; margin-right: 10px;" src="http://imageshack.us/a/img837/4992/eq1t.jpg" width="90px" height="120px">[b]MUTTER:[/b] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores.<br clear="all">
<img style="float: right; margin-left: 10px;" src="http://imageshack.us/a/img837/4992/eq1t.jpg" width="90px" height="120px">[b]VATER:[/b] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores.<br clear="all">

<div class="head2">Freunde</div>

<div class="head">Bekannte</div>

<div class="head2">Schwärmereien & Geliebte</div>

<div class="head">Gehasste</div>

<div class="head2">Vergangenheit</div>

</div></center>
Nach oben Nach unten
http://bravewood.forumieren.com
The Guardian
possessed by a demon
avatar


BeitragThema: Re: Vorlage ~ Beziehungen   Mo Jun 24, 2013 10:47 am

Sowohl die Farben als auch die Überschriften sind frei variierbar. Wer etwas ändern möchte, aber nicht weiß wie, der kann sich gerne an das Team wenden.

Eine neue Person mit dem Bild auf der linken Seite fügt ihr mit folgendem Code hinzu:
Code:
<img style="float: left; margin-right: 10px;" src="http://imageshack.us/a/img837/4992/eq1t.jpg" width="90px" height="120px">[b]NAME:[/b] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores.<br clear="all">

Für eine Person mit dem Bild auf der rechten Seite, nutzt ihr folgenden Code:
Code:
<img style="float: right; margin-left: 10px;" src="http://imageshack.us/a/img837/4992/eq1t.jpg" width="90px" height="120px">[b]NAME:[/b] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores.<br clear="all">

_____________________________________________________________________________________

Eine kurze Erklärung zu obigem Code:

Dieser Code ist für das kleine Bild verantwortlich, welches die Maße 90x120px haben sollte, da es sonst verzerrt und auf diese Maße gebracht wird. Das Attribut 'float' sorgt hierbei dafür, dass der Text neben dem Bild geschrieben werden kann. 'margin-right' bzw. 'margin-left' sorgt für den kleinen Abstand zwischen Bild und Text. 'width' und 'height' sorgen dafür, dass das Bild in jedem Fall die gewünschten Maße hat.
Code:
<img style="float: left; margin-right: 10px;" src="http://imageshack.us/a/img837/4992/eq1t.jpg" width="90px" height="120px">

Das pseudolateinische BlaBla hat keine weitere Bedeutung und ist einfach nur ein Platzhalter für den kleinen Text den ihr am besten zu jeder Person schreiben solltet.
Am Ende steht noch ein kurzer Code, dieser sorgt lediglich dafür, dass ihr danach unterhalb des Bildes weiter schreiben könnt und nicht weiterhin neben dem Bild schreibt.
Code:
<br clear="all">
Nach oben Nach unten
http://bravewood.forumieren.com
 

Vorlage ~ Beziehungen

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach oben 
Seite 1 von 1

 Ähnliche Themen

-
» Lange beziehungen wie geht ihr damit um?
» [WICHTIG]-Die Steckbrief-Vorlage!
» Jobcenter darf auch die Vorlage von Kontoauszügen der vergangenen sechs Monate verlangen aufgrund des unregelmäßigen Einkommens der Antragstellerin
» HTML Steckbrief Vorlage
» Todesstern Spielmatte - PDF Vorlage

Befugnisse in diesem ForumSie können in diesem Forum nicht antworten
 :: Character-Stuff :: »Beziehungen-