» WELCOME IN HELL

Herzlich Willkommen in Glass Dome. (:
Es freut uns, dass du hierher gefunden hast.
Wenn du Lust hast sieh dich gerne einmal genauer um;
doch einmal eingewiesen gibt es kein Entkommen mehr -
sei dir darüber im klaren!
Im Moment wird im Forum selbst alles ein wenig umgemodelt, aber keine Sorge, das RPG ist und bleibt aktiv.
Übrigens haben wir Kekse.
Liebe Grüße, das Admin Team; Limlim (Liam) & Lexipuh (Alex)
» MOST WANTED!

xx Aufnahmestopp: Psychologen // Forschungsobjekte (ohne Forscher)

xx Aktive Gesuche : xx Übernehmbare Charaktere (1x weiblich // 2x männlich)

» SHORT FACTS
xx Das Forum ist für Nutzer ab 14 Jahren
xx Die Mindest- länge der Posts Ingame beträgt 200 Wörter
» SHORT FACTS
xx Euer Avatar muss 200 x 380px groß sein
xx Eure Sig- natur darf nicht breiter als 500 px sein
»Plot 3 - Die Endzeit

xx 3 Wochen nach der verhängnisvollen Nacht, ist wieder etwas Ruhe in Glassdome eingekehrt und das Institut will die Schüler an die Schule heranführen.

Uhrzeit: Später Nachmittag - Früher Abend (17-19 Uhr)
Wetter: stark bewölkt, kaum sonnig (23-24°C)
» EVENTS

xx Momentan ist kein Event aktiv - Ideen sind gerne bei Liam/GM anzumelden.


 
StartseiteStartseite  KalenderKalender  FAQFAQ  SuchenSuchen  MitgliederMitglieder  NutzergruppenNutzergruppen  AnmeldenAnmelden  LoginLogin  

Teilen | .
 

 Boxen,Boxen,Boxen!

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach unten 
AutorNachricht
Gast
Gast

BeitragThema: Boxen,Boxen,Boxen!   Mo 30 Dez 2013, 20:31

Hallo Gast!

In diesem Tutorial zeige ich dir, wie man Boxen und Tabellen macht.

Es gibt einen einfachen Grundbau, den man sich leicht merken kann, wenn man weiß, für Größe,farbe und so weiter steht.

Da wir wissen, welche größe der Kasten haben soll,schreiben wir:

Code:
 <div style="width:150px;height:70px;border:2px

um die Farbe zu definieren, fügen wir folgendes ein:

Code:
  solid white;">

Dann haben wir die erste zeile fertig. das Aussehen ist angegeben, deshalb muss am ende auch ein > hin.

Dann müsste der Code so aussehen:

Code:
<div style="width:150px;height:70px;border:2px  solid white;">

Um den Text im Kasten anzugeben, schreibt ihr ihn einfach und beendet den Code
Das sieht dann so aus:

Code:
 <div style="width:150px;height:70px;border:2px  solid white;">
    Das ist ein Beispiel!
    </div>

der Kasten sieht dann so aus:


Das ist ein Beispiel!


Ihr könnt ihn natürlich auch rot machen:


Das ist ein Beispiel!


Code:
    <div style="width:150px;height:70px;border:2px  solid red;">
    Das ist ein Beispiel!
    </div>

wollt ihr noch ein bild als Hintergrund?

Code:
 background-image: url("LINK")

oder eine Farbe?


Das ist ein Beispiel!


Code:
    <div style="width:150px;height:70px;border:2px  solid red; background-color: white ">
    [color=black]Das ist ein Beispiel![/color]
    </div>

Um die schriftfarbe zu ändern:

Code:
 [color=white/black/green/...] TEXT IM KASTEN [/color]

Nach oben Nach unten
Gast
Gast

BeitragThema: Re: Boxen,Boxen,Boxen!   Mi 16 Apr 2014, 17:01

Liebe, Aimi, mit Tabellen hat das hier aber gar nichts zu tun und viel Erklärung ist das auch nicht. Darf ich ergänzen? Ich hab mal ein Tutorial geschrieben, sieht folgendermaßen aus und ist eigentlich die Vorerklärung für deine Angaben:

Woraus besteht ein Div?
Aus HTML und CSS. Der HTML-Teil gibt an, was wo umgesetzt werden soll, während der CSS-Teil lediglich die Definition dessen ist. Alternativ kann der CSS-Teil gleich in den HTML-Teil mit eingebunden werden.

Woraus besteht eine Tabelle?
Aus HTML (und optional auch aus CSS). Im HTML-Teil wird die komplette Tabelle definiert, der CSS-Teil kann direkt dort mit eingebunden werden oder alternativ extra in einem CSS-Code definiert werden.

Grundstruktur eines Divs
Code:
<div>
Inhalt
</div>

Wie definiere ich Divs nun?
Es gibt zwei Möglichkeiten. Du leitest das zu definierende Element im CSS-Teil mit .name oder mit #name ein, während es im HTML entsprechend mit class=“name“ und id=“name“ angegeben wird. Alternativ kann das CSS auch gleich im HTML-Teil eingebunden und dort definiert werden:
style=“CSS-Definition;“

Wie sieht das nun aus?
Code:
<div class="name">
Inhalt
</div>

<div id="name">
Inhalt
</div>
(Es macht keinen Unterschied, welche Variante du verwendest, ob nun id oder class, das ist vollkommen egal. Lediglich die Bezeichnung ist eine andere)

Code:
<div style="bereich: befehl;">
Inhalt
</div>
(Hier besteht der Nachteil, dass Fremde deine CSS-Definitionen einsehen können)

Wie sieht das CSS aus?
Es ist wie folgt aufgebaut:

Code:
.name {
      bereich: befehl;
}
oder
Code:
#name {
      bereich: befehl;
}


Grundstruktur einer Tabelle
Code:
<table>
<tr>
<td>
Inhalt
</td>
</tr>
</table>

<*table> und <*/table> umfassen die komplette Tabelle, sie sind sozusagen der äußere Rahmen.
<*tr> leitet eine Zeile ein und <*/tr> schließt sie.
<*td> leitet eine Spalte innerhalb einer Zeile ein und <*/td> schließt sie.

Wie definiere ich Tabellen?
Mit einfachen HTML Befehlen, die in den Code eingebunden werden:

Code:
<table bereich="befehl">
Durch eine id oder class:
Code:
<table id="name">
<table class="name">

Durch CSS, eingebunden im HTML-Teil:
Code:
<table style="bereich: befehl;">
Nach oben Nach unten
 

Boxen,Boxen,Boxen!

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

Befugnisse in diesem ForumSie können in diesem Forum nicht antworten
 ::  :: Tutorials :: Code-tutorials-