Community-Wiki

Achtung: Fandom stellt ab dem 31.12.2023 bis auf Weiteres den Support für die deutsche Sprache ein. Nach diesem Datum müssen alle Anfragen im englischen Community Central oder über das Kontaktformular gestellt werden.

MEHR ERFAHREN

Community-Wiki
Du hast noch kein Benutzerkonto?
Registrieren
Registrieren
Community-Wiki
Community-Wiki
1.207
Seiten
in: Wikitext
Deutsch

Änderungen: Hilfe:HTML

Zurück zur Seite
Zum Bearbeiten anmelden
K (→‎Siehe auch: Wikimedia Hilfeseite gibt's im Meta-Wiki auch auf deutsch)
K (*be)
(46 dazwischenliegende Versionen von 11 Benutzern werden nicht angezeigt)
Zeile 1: Zeile 1:
 
{{Hilfebalken}}
  
{{Hilfebalken}}
  +
{{Wikitext}}
−
Manche '''HTML''' Tags können in Wikia verwendet werden. Wie auch immer, wird empfohlen [[w:c:help:Help:Wikitext|Wikitext <small>(englisch)</small>]] beim Bearbeiten zu verwenden, da HTML Code schwieriger zu lesen ist und für neue Benutzer abschreckend wirkt.
  
  +
Standardmäßig benutzt man beim Bearbeiten in der [[Hilfe:Code-Ansicht|Code-Ansicht]] die spezielle [[Hilfe:Wikitext|Wikitext]]-Syntax. Es gibt aber diversen '''HTML'''-Code, der darin auch funktioniert.
   
  ⚫
Viel komplexer HTML-Code kann in [[Hilfe:Vorlagen|Vorlagen]] ausgelagert werden, damit durchschnittliche Benutzer nicht davon abgeschreckt werden.
−
CSS Klassen (class="Klassenname") können in [[Hilfe:Skins|Stylesheets]] gelagert werden. Beide Klassen und CSS Inline Styles wie zum Beispiel ''style="color:pink;"'' können mit den HTML Tags weiter unten verwendet werden - bitte beachte aber auch, dass CSS auch in Wiktext eingebunden werden kann (besonders bei [[w:c:help:Help:Tables|Tabellen, Zeilen und Zellen]]).
  
   
  +
== Grundlagen ==
−
: '''Notiz:''' das "background-image" muss volle URLs verwenden ("http://whatever.whatever/whatever/filename.ext"). Die Url muss in einer Klasse in einem Stylesheet angegeben sein. Dies funktioniert nicht, wenn die CSS bereits ''"inline"'' angegeben ist.
  
   
  +
Eine Webseite ist im Kern eigentlich nur eine Textdatei, und ''HTML'' ist die Syntax, aus welcher ein Web-Browser eine recht simple Seite aufbaut.<ref>Zum Veranschaulichen im Browser mal auf <code>Ansicht -> Webseitenstil -> Kein Stil</code></ref> Diese simple Seite wird dann mit [[Hilfe:CSS|CSS]]-Anweisungen weiter gestaltet. Interaktivität wird mittels [[Hilfe:JavaScript|JavaScript]] hinzugefügt.
⚫
Viel komplexer HTML und CSS Code kann in [[Hilfe:Vorlagen|Vorlagen]] gelagert werden, damit normale Benutzer nicht davon abgeschreckt werden.
 
   
  +
Die Grundlage von HTML sind ''Tags'', die oft die Form <code><nowiki><foo>___</foo></nowiki></code> haben. HTML-Tags können mehrere weitere Tags oder auch puren Text umschließen. Es gibt auch Tags, die nur aus einer Komponente bestehen (<code><nowiki><bar /></nowiki></code>) und nichts umschließen können.
−
Die folgenden HTML Tags können in Wikia verwendet werden:
  
  +
−
{| border="0" cellpadding="5"
  
  +
== HTML-Tags ==
−
| valign="top"|
  
  +
Die untenstehenden HTML-Tags können im Wikitext verwendet werden. Jeder Tag hat eine bestimmte semantische Bedeutung und ist für einen bestimmten Inhaltstyp vorgesehen (nicht immer zutreffend).
⚫
* &lt;abbr&gt;
  
  +
⚫
* &lt;acronym&gt;
  
  +
Weitere Tags werden durch [[Hilfe:MediaWiki|MediaWiki]] oder [[Hilfe:Erweiterungen|Erweiterungen]] zur Verfügung gestellt.
⚫
* &lt;b&gt;
  
  +
{| class="wikitable article-table" style="vertical-align:top;width:30%;float:left;"
⚫
* &lt;big&gt;
  
  +
!Tag
⚫
* &lt;blockquote&gt;
  
  +
!Semantik
⚫
* &lt;br&gt;
  
  +
|-
⚫
* &lt;caption&gt;
  
−
* &lt;center&gt;
 +
|&lt;abbr&gt;
  +
|Abkürzung (Erklärung per ''title''-[[#HTML-Attribute|Attribut]])
⚫
* &lt;cite&gt;
  
  +
|-
⚫
* &lt;code&gt;
  
−
* &lt;dd&gt;
 +
| &lt;b&gt;
  +
| anders zu stylender Text (als fett)
⚫
* &lt;del&gt;
  
  +
|-
⚫
* &lt;div&gt;
  
−
* &lt;dl&gt;
 +
| &lt;blockquote&gt;
  +
| Blockzitat
⚫
* &lt;dt&gt;
  
  +
|-
⚫
* &lt;em&gt;
  
−
* &lt;font&gt;
 +
| &lt;br /&gt;
  +
| Zeilenumbruch
−
| valign="top"|
  
  +
|-
⚫
* &lt;h1&gt;
  
−
* &lt;h2&gt;
 +
| &lt;caption&gt;
  +
|
⚫
* &lt;h3&gt;
  
  ⚫
[[Hilfe:HTML/Tabellen|Tabellenüberschrift]]
⚫
* &lt;h4&gt;
  
  +
|-
⚫
* &lt;h5&gt;
  
−
* &lt;h6&gt;
 +
| &lt;cite&gt;
  +
| Referenzangabe
⚫
* &lt;hr&gt;
  
  +
|-
⚫
* &lt;i&gt;
  
−
* &lt;ins&gt;
 +
| &lt;code&gt;
  +
| Code
⚫
* &lt;li&gt;
  
  +
|-
⚫
* &lt;ol&gt;
  
−
* &lt;p&gt;
 +
| &lt;data&gt;
  +
| maschinenlesbare Daten (Maschinenwert per ''value''-[[#HTML-Attribute|Attribut]])
⚫
* &lt;pre&gt;
  
  +
|-
⚫
* &lt;q&gt;
  
−
* &lt;rb&gt;
 +
| &lt;dd&gt;
  +
| Beschreibung in einer [[Hilfe:HTML/Listen|Definitionsliste]]
⚫
* &lt;rp&gt;
  
  +
|-
⚫
* &lt;rt&gt;
  
  ⚫
| &lt;del&gt;
−
| valign="top"|
  
  +
| ungültig gewordener Text
⚫
* &lt;ruby&gt;
  
  +
|-
⚫
* &lt;s&gt;
  
−
* &lt;small&gt;
 +
| &lt;dfn&gt;
  +
| der definierte Teil
⚫
* &lt;span&gt;
  
  +
|-
⚫
* &lt;strike&gt;
  
−
* &lt;strong&gt;
 +
| '''&lt;div&gt;'''
  +
| '''generische Box (für weitere Verarbeitung)'''
⚫
* &lt;sub&gt;
  
  +
|-
⚫
* &lt;sup&gt;
  
−
* &lt;table&gt;
 +
| &lt;dl&gt;
  +
| [[Hilfe:HTML/Listen|Definitionsliste]]
⚫
* &lt;td&gt;
  
  +
|-
⚫
* &lt;th&gt;
  
−
* &lt;tr&gt;
 +
| &lt;dt&gt;
  +
| Terminus in einer [[Hilfe:HTML/Listen|Definitionsliste]]
⚫
* &lt;tt&gt;
  
  +
|-
⚫
* &lt;u&gt;
  
−
* &lt;ul&gt;
 +
| &lt;em&gt;
  +
| hervorgehobener Text
−
* &lt;var&gt;
  
⚫
* &lt;!-- ... --&gt;
  
 
|}
  
|}
  +
{| class="wikitable article-table" style="vertical-align:top;width:30%;float:left;"
  +
! Tag
  +
! Semantik
  +
|-
  ⚫
| &lt;h1&gt;
  +
| Oberste Überschrift
  +
|-
  ⚫
| &lt;h2&gt;
  +
| Standardüberschrift
  +
|-
  ⚫
| &lt;h3&gt;
  +
| Unterüberschrift
  +
|-
  ⚫
| &lt;h4&gt;
  +
| Unterüberschrift
  +
|-
  ⚫
| &lt;h5&gt;
  +
| Unterüberschrift
  +
|-
  ⚫
| &lt;h6&gt;
  +
| Unterüberschrift
  +
|-
  ⚫
| &lt;hr&gt;
  +
| Themenwechsel (als Linie)
  +
|-
  ⚫
| &lt;i&gt;
  +
| hervorgehobene Sprache (als kursiv)
  +
|-
  ⚫
| &lt;ins&gt;
  +
| später hinzugefügter Text
  +
|-
  ⚫
| &lt;kbd&gt;
  +
| Tastatureingaben
  +
|-
  ⚫
| &lt;li&gt;
  +
| [[Hilfe:HTML/Listen|Listenpunkt]]
  +
|-
  ⚫
| &lt;mark&gt;
  +
| Markierungen zB in Suchergebnissen
  +
|-
  ⚫
| &lt;ol&gt;
  +
| [[Hilfe:HTML/Listen|Aufzählende Liste]]
  +
|-
  ⚫
| &lt;p&gt;
  +
| Paragraph
  +
|-
  ⚫
| '''&lt;pre&gt;'''
  +
| '''vorformatierter Text (wysiwyg)'''
  +
|-
  ⚫
| &lt;q&gt;
  +
| Zitat im Text
  +
|-
  ⚫
| &lt;rp&gt;
  +
| Ersatzklammern, wenn kein unterstütztes &lt;ruby&gt;
  +
|-
  ⚫
| &lt;rt&gt;
  +
|Aussprache eines asiatischen Zeichens
  +
|}
  +
{| class="wikitable article-table" style="vertical-align:top;width:30%;float:left;"
  +
! Tag
  +
! Semantik
  +
|-
  ⚫
| &lt;ruby&gt;
  +
|Erläuterung von asiatischer Aussprache
  +
|-
  ⚫
| &lt;s&gt;
  +
|gestrichener Text
  +
|-
  ⚫
| &lt;samp&gt;
  +
|Beispiel-Output
  +
|-
  ⚫
| &lt;small&gt;
  +
|Nebenbemerkungen / Kleindruck
  +
|-
  ⚫
| '''&lt;span&gt;'''
  +
|'''generische Textmarkierung (für weitere Verarbeitung)'''
  +
|-
  ⚫
| &lt;strong&gt;
  +
|wichtiger Text
  +
|-
  ⚫
| &lt;sub&gt;
  +
|niedriggestellter Text
  +
|-
  ⚫
| &lt;sup&gt;
  +
|hochgestellter Text
  +
|-
  ⚫
| &lt;table&gt;
  +
|[[Hilfe:HTML/Tabellen|Tabelle]]
  +
|-
  ⚫
| &lt;td&gt;
  +
|[[Hilfe:HTML/Tabellen|Tabellenzelle]]
  +
|-
  ⚫
| &lt;th&gt;
  +
|[[Hilfe:HTML/Tabellen|Tabellenkopfzelle]]
  +
|-
  ⚫
| &lt;time&gt;
  +
|Uhrzeit oder Datum (Maschinenwert alternativ per ''datetime''-[[#HTML-Attribute|Attribut]])
  +
|-
  ⚫
| &lt;tr&gt;
  +
|Tabellenzeile
  +
|-
  ⚫
| &lt;u&gt;
  +
|falsch geschriebene Wörter (als unterstrichen)
  +
|-
  ⚫
| &lt;ul&gt;
  +
|[[Hilfe:HTML/Listen|unsortierte Liste]]
  +
|-
  ⚫
| &lt;var&gt;
  +
|Variable in Code oder Mathematik
  +
|-
  ⚫
| '''&lt;!-- ... --&gt;'''
  +
| '''Unsichtbarer Kommentar'''
  +
|}
  +
<br style="clear:both;" />
  +
  +
== HTML-Attribute ==
  +
Im öffnenden (bzw. einzelnen) Tag können vorgesehene Attribute im Format ''<code><nowiki><foo attribut="wert" attribut2="wert2">___</foo></nowiki></code>'' übergeben werden, so zum Beispiel CSS-Klassen (<code>class="warnung"</code>) oder [[Hilfe:Inline-CSS|CSS-Inline-Styles]] (<code>style="color:pink; background-color:black;"</code>). Bei Tabellen sind sogar im Wikitext-Format HTML-Attribute möglich, siehe [[/Tabellen]] bzw. [[Hilfe:Tabellen#Inline-CSS]].
  +
  +
== Mögliche Fehler ==
  +
;Abschließenden Tag vergessen
  +
: Wird ein Tag nicht richtig abgeschlossen, dann macht der Internetbrowser des Betrachters dies von sich aus automatisch, aber man weiß nicht wo. Und der [[Hilfe:RTE|grafische Editor]] fügt auch mal gelegentlich fehlende schließende Tags eigenmächtig zum Wikitext hinzu, und das nicht unbedingt an die gewollte Stelle!
  +
  +
;Sich kreuzende HTML-Tags
  +
: Code wie etwa <code style="color:red;" lang="html5" enclose="none"><nowiki><div> … <span > … </div> … </span></nowiki></code> ist '''ungültig'''. Tags können in andere Tags nur komplett geschachtelt werden: <code style="color:green;" lang="html5" enclose="none"><nowiki><div> … <span > … </span> … </div></nowiki></code>
  +
: Dies gilt auch bei dem Einsatz in Kombination mit Wikitabellen: Tabellen komplett zwischen die Tags, bzw. Tags komplett in eine Tabellenzelle!
  +
  ⚫
== Siehe auch ==
  +
* [[Hilfe:HTML/5|Veraltetes HTML]]
  ⚫
* [[:MetaWikipedia:Help:HTML in wikitext|HTML im Wikitext <small>(englisch)</small>]]
  ⚫
* [[:Wikipedia:Wikipedia:Span tags|Information über die Verwendung von Span-Tags <small>(englisch)</small>]]
  +
* https://wiki.selfhtml.org
  +
  +
== Mehr Hilfe ==
  +
{{Hilfe/Feedback}}
   
  +
<small><references /></small>
⚫
==Siehe auch==
  
⚫
*[[Hilfe:Tabellen|Hilfe für Tabellen]]
  
−
*[[Hilfe:Skins|Skins in Wikia]]
  
−
*[[MetaWikipedia:Hilfe:Bearbeiten|Wikimedia Hilfeseite]]
  
⚫
*[[MetaWikipedia:Help:HTML in wikitext|Verwende HTML im Wikitext <small>(englisch)</small>]]
  
⚫
*[[Wikipedia:Wikipedia:Span tags|Information über die Verwendung von Span Tags <small>(englisch)</small>]]
  
   
  +
[[be:Help:HTML]]
 
[[en:Help:HTML]]
  
[[en:Help:HTML]]
  +
[[es:Ayuda:HTML]]
−
[[Kategorie:Bearbeitungshilfe|{{PAGENAME}}]]
  
  +
[[fr:Aide:HTML]]
  +
[[it:Aiuto:HTML]]
  +
[[ja:ヘルプ:HTML]]
  +
[[ko:도움말:HTML]]
  +
[[nl:Help:HTML]]
  +
[[pl:Pomoc:HTML]]
  +
[[pt:Ajuda:HTML]]
  +
[[ro:Ajutor:HTML]]
  +
[[ru:Справка:HTML]]
  +
[[tr:Yardım:HTML]]
  +
[[uk:Довідка:HTML]]
  +
[[vi:Trợ giúp:HTML]]
  +
[[zh:Help:HTML]]

Version vom 31. Mai 2021, 10:05 Uhr

Coding

Wiki-Code

Der folgende Text betrifft das Schreiben von Wiki-Syntax, die in einem Quelltexteditor eingegeben werden muss.

Standardmäßig benutzt man beim Bearbeiten in der Code-Ansicht die spezielle Wikitext-Syntax. Es gibt aber diversen HTML-Code, der darin auch funktioniert.

Viel komplexer HTML-Code kann in Vorlagen ausgelagert werden, damit durchschnittliche Benutzer nicht davon abgeschreckt werden.

Grundlagen

Eine Webseite ist im Kern eigentlich nur eine Textdatei, und HTML ist die Syntax, aus welcher ein Web-Browser eine recht simple Seite aufbaut.[1] Diese simple Seite wird dann mit CSS-Anweisungen weiter gestaltet. Interaktivität wird mittels JavaScript hinzugefügt.

Die Grundlage von HTML sind Tags, die oft die Form <foo>___</foo> haben. HTML-Tags können mehrere weitere Tags oder auch puren Text umschließen. Es gibt auch Tags, die nur aus einer Komponente bestehen (<bar />) und nichts umschließen können.

HTML-Tags

Die untenstehenden HTML-Tags können im Wikitext verwendet werden. Jeder Tag hat eine bestimmte semantische Bedeutung und ist für einen bestimmten Inhaltstyp vorgesehen (nicht immer zutreffend).

Weitere Tags werden durch MediaWiki oder Erweiterungen zur Verfügung gestellt.

Tag Semantik
<abbr> Abkürzung (Erklärung per title-Attribut)
<b> anders zu stylender Text (als fett)
<blockquote> Blockzitat
<br /> Zeilenumbruch
<caption>

Tabellenüberschrift

<cite> Referenzangabe
<code> Code
<data> maschinenlesbare Daten (Maschinenwert per value-Attribut)
<dd> Beschreibung in einer Definitionsliste
<del> ungültig gewordener Text
<dfn> der definierte Teil
<div> generische Box (für weitere Verarbeitung)
<dl> Definitionsliste
<dt> Terminus in einer Definitionsliste
<em> hervorgehobener Text
Tag Semantik
<h1> Oberste Überschrift
<h2> Standardüberschrift
<h3> Unterüberschrift
<h4> Unterüberschrift
<h5> Unterüberschrift
<h6> Unterüberschrift
<hr> Themenwechsel (als Linie)
<i> hervorgehobene Sprache (als kursiv)
<ins> später hinzugefügter Text
<kbd> Tastatureingaben
<li> Listenpunkt
<mark> Markierungen zB in Suchergebnissen
<ol> Aufzählende Liste
<p> Paragraph
<pre> vorformatierter Text (wysiwyg)
<q> Zitat im Text
<rp> Ersatzklammern, wenn kein unterstütztes <ruby>
<rt> Aussprache eines asiatischen Zeichens
Tag Semantik
<ruby> Erläuterung von asiatischer Aussprache
<s> gestrichener Text
<samp> Beispiel-Output
<small> Nebenbemerkungen / Kleindruck
<span> generische Textmarkierung (für weitere Verarbeitung)
<strong> wichtiger Text
<sub> niedriggestellter Text
<sup> hochgestellter Text
<table> Tabelle
<td> Tabellenzelle
<th> Tabellenkopfzelle
<time> Uhrzeit oder Datum (Maschinenwert alternativ per datetime-Attribut)
<tr> Tabellenzeile
<u> falsch geschriebene Wörter (als unterstrichen)
<ul> unsortierte Liste
<var> Variable in Code oder Mathematik
<!-- ... --> Unsichtbarer Kommentar


HTML-Attribute

Im öffnenden (bzw. einzelnen) Tag können vorgesehene Attribute im Format <foo attribut="wert" attribut2="wert2">___</foo> übergeben werden, so zum Beispiel CSS-Klassen (class="warnung") oder CSS-Inline-Styles (style="color:pink; background-color:black;"). Bei Tabellen sind sogar im Wikitext-Format HTML-Attribute möglich, siehe /Tabellen bzw. Hilfe:Tabellen#Inline-CSS.

Mögliche Fehler

Abschließenden Tag vergessen
Wird ein Tag nicht richtig abgeschlossen, dann macht der Internetbrowser des Betrachters dies von sich aus automatisch, aber man weiß nicht wo. Und der grafische Editor fügt auch mal gelegentlich fehlende schließende Tags eigenmächtig zum Wikitext hinzu, und das nicht unbedingt an die gewollte Stelle!
Sich kreuzende HTML-Tags
Code wie etwa <div> … <span > … </div> … </span> ist ungültig. Tags können in andere Tags nur komplett geschachtelt werden: <div> … <span > … </span> … </div>
Dies gilt auch bei dem Einsatz in Kombination mit Wikitabellen: Tabellen komplett zwischen die Tags, bzw. Tags komplett in eine Tabellenzelle!

Siehe auch

Mehr Hilfe

Беларуская English Español Français Italiano 日本語 한국어 Nederlands Polski Português Română Русский Türkçe Українська Tiếng Việt 中文
Nutzung von Community-Inhalten gemäß CC-BY-SA, sofern nicht anders angegeben.