Html: Unterschied zwischen den Versionen

Aus WacheWiki
Zur Navigation springenZur Suche springen
K (scheinbar funktionieren reguläre Anführungszeichen bei Linksetzungen im Silly-Stil nicht mehr.)
 
(10 dazwischenliegende Versionen von 5 Benutzern werden nicht angezeigt)
Zeile 5: Zeile 5:
 
== Links ==
 
== Links ==
 
Über das hinaus, was wir hier her packen, kann man in der Regel nach den richtigen Befehlen googeln, wenn man weiß, was man sucht. Hilfreich fand ich bisher Selfhtml[http://de.selfhtml.org/], aber da sind die Geschmäcker ja verschieden.
 
Über das hinaus, was wir hier her packen, kann man in der Regel nach den richtigen Befehlen googeln, wenn man weiß, was man sucht. Hilfreich fand ich bisher Selfhtml[http://de.selfhtml.org/], aber da sind die Geschmäcker ja verschieden.
 +
Übrigens: Solltet ihr mal einen Link in der Geschichte (in die Fußnote) packen wollen, sähe der Quellcode so aus: <pre><a href='http://www.stadtwache.net/phps/zeigemission.php?art=S&nummer=1' target='_new'>Dieser Link verweist auf die erste Single, die im Wache-Archiv gespeichert ist. (1999) Er öffnet sich [target='_new'] nicht im gleichen Fenster.</a></pre>
  
 
== Kursiv ==
 
== Kursiv ==
Zeile 10: Zeile 11:
  
 
== Zentrierung ==  
 
== Zentrierung ==  
<pre><div align="center">So schreibe ich in der Mitte der Zeile.</div></pre>Wenn man nicht direkt (ohne Zeilenumbruch) weiterschreibt, wird meist viel Platz vom Browser interpretiert ... ausprobieren.
+
<pre><center>So schreibe ich in der Mitte der Zeile.</center></pre>Wenn man nicht direkt (ohne Zeilenumbruch) weiterschreibt, wird meist viel Platz vom Browser interpretiert ... ausprobieren.
  
 
== Fett ==
 
== Fett ==
<pre><b>Das ist fett.</b></pre> Mann kann <b>fett</b> und <i>kursiv</i> auch <pre><b></i>kombinieren</i></b>.</pre>
+
<pre><b>Das ist fett.</b></pre> Mann kann <b>fett</b> und <i>kursiv</i> auch <pre><b><i>kombinieren</i></b>.</pre>
  
 
== Fußnoten ==
 
== Fußnoten ==
 
Fußnoten kann man am einfachsten mit <pre>[*Fußnote*]</pre> direkt dort in den Text eintragen, wo später das * erscheinen soll. Nummeriert werden sie von allein.
 
Fußnoten kann man am einfachsten mit <pre>[*Fußnote*]</pre> direkt dort in den Text eintragen, wo später das * erscheinen soll. Nummeriert werden sie von allein.
 +
 +
== TOD / Small ==
 +
Der Code, den wir für Formatierungen auf der Spielwiese benutzen können, wurde vom fleißigen Programmiererteam erweitert. Man kann Text jetzt in Kapitälchen setzen mit folgendem Tag:
 +
<pre><tod>Es gibt keine Gerechtigkeit</tod>, sagte die Gestalt in der Kutte. <tod>Es gibt nur mich.</tod></pre>
 +
Damit kann man auch für Theaterstücke die Namen der auftretenden Personen schreiben.
 +
 +
Wer die Buchstaben lieber einzeln bearbeitet (oder hier für generelle html-Zwecke reinguckt), dem stelle ich hier nochmal den html-Quelltext zur Verfügung.
 +
<pre>I<small>CH BIN DER</small> T<small>OD</small></pre>
 +
Für längere Texte bietet sich die CSS-Alternative an:
 +
<pre><span style="font-variant:small-caps">Ich bin der Tod</span></pre>
 +
 +
Der Effekt sieht jedenfalls so aus: I<small>CH BIN DER</small> T<small>OD</small>
  
 
== Farben ==
 
== Farben ==
Zeile 29: Zeile 42:
 
== Zettel und ähnliches ==
 
== Zettel und ähnliches ==
 
Manchmal ist es nett (Ansichtssache), einen Zettel grafisch darzustellen.  
 
Manchmal ist es nett (Ansichtssache), einen Zettel grafisch darzustellen.  
<pre><div align="center"> <table border="1" > <tr><th>Ich persönlich zentriere das gern.</td></tr> </table> </div>
+
<pre><div align="center"> <table border="1" > <tr><th>Ich persönlich zentriere das gern.</th></tr> </table> </div>
<table border="1">  <colgroup> <col width="120"> <col width="400"> </colgroup>  <tr><th>Linke Spalte</th><td>Rechte Spalte</td></tr>  <tr><th>Zweite Zeile</th><td>und so weiter</td></tr> <tr><th>Dies ist nun schon die die dritte Zeile</th><td>Dies ist nur ein Beispieltext, der demonstriert, wie die Tabelle mit verschieden langen Seitenstücken umgeht.</td></tr></table></pre>
+
<table border="1">  <colgroup> <col width="120"> <col width="400"> </colgroup>  <tr>
 +
<th>Linke Spalte</th><td>Rechte Spalte</td></tr>  <tr><th>Zweite Zeile</th>
 +
<td>und so weiter</td></tr>
 +
<tr>
 +
<th>Dies ist nun schon die die dritte Zeile</th><td>Dies ist nur ein Beispieltext, der demonstriert, wie die Tabelle mit verschieden langen Seitenstücken umgeht.</td>
 +
</tr></table></pre>

Aktuelle Version vom 19. Oktober 2012, 12:31 Uhr

Ich denke, da wir ja Geschichten mit HTML fakultativ verschönern, sollten wir mal beginnen, die wichtigsten (und schönsten) Befehle der Wache-Öffentlichkeit zur Verfügung zu stellen.
Denkt dran: HTML ist keine Programmiersprache, sondern eine Beschreibungssprache. Für alles gilt, dass man ausprobieren sollte, was den eigenen Geschmack trifft.
Und nicht vergessen: Was einen Anfang hat, braucht auch ein Ende - dargestellt durch '/Befehl'. Wie alle HTML-Befehle in spitzen Klammern. (siehe unten)

Links

Über das hinaus, was wir hier her packen, kann man in der Regel nach den richtigen Befehlen googeln, wenn man weiß, was man sucht. Hilfreich fand ich bisher Selfhtml[1], aber da sind die Geschmäcker ja verschieden.

Übrigens: Solltet ihr mal einen Link in der Geschichte (in die Fußnote) packen wollen, sähe der Quellcode so aus:

<a href='http://www.stadtwache.net/phps/zeigemission.php?art=S&nummer=1' target='_new'>Dieser Link verweist auf die erste Single, die im Wache-Archiv gespeichert ist. (1999) Er öffnet sich [target='_new'] nicht im gleichen Fenster.</a>

Kursiv

Steht, wie die nächste Formatierung, schon in der Anleitung.

<i>Dies ist ein kursiver Text.</i>

Zentrierung

<center>So schreibe ich in der Mitte der Zeile.</center>

Wenn man nicht direkt (ohne Zeilenumbruch) weiterschreibt, wird meist viel Platz vom Browser interpretiert ... ausprobieren.

Fett

<b>Das ist fett.</b>

Mann kann fett und kursiv auch

<b><i>kombinieren</i></b>.

Fußnoten

Fußnoten kann man am einfachsten mit

[*Fußnote*]

direkt dort in den Text eintragen, wo später das * erscheinen soll. Nummeriert werden sie von allein.

TOD / Small

Der Code, den wir für Formatierungen auf der Spielwiese benutzen können, wurde vom fleißigen Programmiererteam erweitert. Man kann Text jetzt in Kapitälchen setzen mit folgendem Tag:

<tod>Es gibt keine Gerechtigkeit</tod>, sagte die Gestalt in der Kutte. <tod>Es gibt nur mich.</tod>

Damit kann man auch für Theaterstücke die Namen der auftretenden Personen schreiben.

Wer die Buchstaben lieber einzeln bearbeitet (oder hier für generelle html-Zwecke reinguckt), dem stelle ich hier nochmal den html-Quelltext zur Verfügung.

I<small>CH BIN DER</small> T<small>OD</small>

Für längere Texte bietet sich die CSS-Alternative an:

<span style="font-variant:small-caps">Ich bin der Tod</span>

Der Effekt sieht jedenfalls so aus: ICH BIN DER TOD

Farben

Farben werden mit

 <font color="green">grüner Text</font>

ganz einfach generiert. Dabei kann in den Anführungszeichen entweder ein Code aus der HTML Farbtabelle oder der englische Name einer Farbe geschrieben werden.

Durchstreichen

Der Kommandeur ist

<strike>do-</strike>

unser großes Vorbild!

Einrückung

<blockquote>Einfach eingerückt. Und zwar jede Zeile, wenn ihr über das Zeilenende Hinwegschreibt.</blockquote>

Das lässt sich sogar mehrfach machen.(Also den Blockquote-Befehl mehrfach auf- und am Ende wieder zumachen.)

Zettel und ähnliches

Manchmal ist es nett (Ansichtssache), einen Zettel grafisch darzustellen.

<div align="center"> <table border="1" > <tr><th>Ich persönlich zentriere das gern.</th></tr> </table> </div>
<table border="1">  <colgroup> <col width="120"> <col width="400"> </colgroup>  <tr>
<th>Linke Spalte</th><td>Rechte Spalte</td></tr>  <tr><th>Zweite Zeile</th>
<td>und so weiter</td></tr>
<tr>
<th>Dies ist nun schon die die dritte Zeile</th><td>Dies ist nur ein Beispieltext, der demonstriert, wie die Tabelle mit verschieden langen Seitenstücken umgeht.</td>
</tr></table>