Steckbriefgestaltung! (Code und Erleuterung)

Thema: Steckbriefgestaltung! (Code und Erleuterung) Di Sep 24, 2013 8:02 pm

H a l l o , i h r L i e b e n Pink Diamonds

Hier möchte ich euch erklären wie man das Aussehen

eines Steckbriefes beliebig anpassen kann.

Es handelt sich hierbei allerdings vorerst um einen sehr einfachen Code später werde ich noch versuchen einen komplexeren hin zu zufügen und zu erklären, der sich weiterer gestalten lässt als der folgende : )

Zuerst ist hier mal das Aussehen unseres Steckbirefes

B e r r y s S t e c k b r i e f

A l l g e m e i n e s

Username: Dein Name
Name: Name des Charakters
Größe: Größe des Charakters
Geschlecht:
Alter:
Haar:
Aussehen:
Bild: Nicht verpflichtend
Sonstiges:

C h a r a k t e r

Charakter:
Stärken:
Schwächen:
Familie:
Vergangenheit:
Mag: Vorlieben?
Mag nicht: Abneigungen?
Sonstiges: ---

Der Code:

OK, für all die die keine Ahnung von all den Zeichen, die oft sehr irreführend sein können :I haben, erkläre ich hier die Bedeutung all dieser Zeichen.

L e g e n d e

Code:: <link href='' type='text/css'><link href='LINK'

Dieser Text ist der aller erste der in dem Codeabteil ganz oben, also Berrys Steckbrief, zu sehen ist. Zwischen die Zeichen 'LINK' fügt ihr einen Link zu einer Schriftart ein, damit diese verwendet wird.
PS: Schriftarten könnt ihr auf Seiten wie zum Beispiel Dafont.com gratis herunterladen die euch dann für alle Programme offen zur Verfügung stehen.

color: #ffffff

Ich glaube jeder weiß, dass dieses eine Wort bedeutet, Farbe.
Mit diesem Code könnt ihr ganz einfach die Farbe der Schrift und des Strichs dahinter ändern.
Woher ihr die Farbenzeichen herbekommt(zB #ffffff, #000000,..)?
Ganz einfach, bei zum Beispiel GIMP, Photoshop oder sonstigen Programmen bei denen ihr Farben für Schriften, Pinsel, enc. ändern könnt. Kopiert einfach den Code und fügt ihn hinter colour: ein.

font-size: 50px; border-bottom: 20px solid #d36898; font-family: ''; ">B e r r y s S t e c k b r i e f

mit font-size ganz zu Begin dieses Codes, könnt ihr die Größe der Überschrift ändern.
Mit border-buttom: -px solid #------
Könnt ihr die Pixel(px) also die Größe des Striches angeben und ihn dann mit dem colour: Code beliebig färben.
Und dort wo hier B e r r y s S t e c k b r i e f steht, könnt ihr irgendetwas reintippseln und das wird dann als Überschrift vor dem Strich angezeigt : )

Kommen wir nun zum eigentlichen Steckbrief(dies war ja nur die allgemeine Überschrift)

Dieser ist eigentlih genau so aufgebaut wie der Überschriftscode. Er sieht genau so aus und so heißt dass das ihr einfach Schriftart, Farbe, Größe enc. ändern könnt wie beim Vorherigen.
Setzt nur noch unten die Fragen ein. Hüsch sieht es aus wenn ihr diese fett macht. Die Antaworten sind dann dünn und so wird der Steckbrief übersichtlicher(Nur kleiner Tipp am Rande ).
Umgefähr so:
Alter: 14
Geschlecht: männlich
Charakter: hitzig, stur, mürrisch,...

Nuuuun, dass war im Grunde der ganze Glou dieses einfachen Steckbriefs ;D Einfach, oder? Wie gesagt, ich werde noch versuchen einen komplexeren hinzufügen nud erklären enc. bis dahin müsst ihr euch halt noch etwas gedulden ;D

Küsschen, Berry

Pink Diamonds