HTML: Difference between revisions

From Utopia
Jump to navigation Jump to search
(Created page with " == Button == <button>Klick hier</button> == INPUT == <input type="checkbox"> Checkbox1 == Embedded JS == <script> code... </script")
 
No edit summary
 
(12 intermediate revisions by the same user not shown)
Line 1: Line 1:
== Sonderzeichen ==
{| class="wikitable"
|+
!Zeichen
!Code
!Beschreibung
|-
|"
|&amp;Prime;
|einfache Anfuehrungszeichen oben (Sekundenzeichen in der Kartographie )
|-
|"
|&amp;ldquo;
|doppelte anfuehrungszeichen oben / links
|-
|"
|&rdqui;
|doppelte anfuehrungszeichen oben / rechts
|-
|"
|&amp;bdquo;
|doppelte anfuehrungszeichen unten
|-
|...
|&amp;hellip;
|drei Punkte
|-
|
|
|
|}




Line 4: Line 37:
<button>Klick hier</button>
<button>Klick hier</button>


== INPUT ==
<input type="checkbox"> Checkbox1


== Embedded JS ==
== Embedded JS ==
Line 13: Line 44:


</script
</script
== Form ==
<form class="" action="" method="POST">
</form>
Action kann besielsweise ein link zu ner anderen URL sein, wo dann zum Beispiel der inhalt eines Input angefuegt wird.
== INPUT ==
=== Allgemein ===
<input type="field-type" name="field-name" value="default value">
* Man kann anstelle von "value" auch "placeholder" einsetzen... dann wird es grau anstelle schwarz geschrieben, und bei einem "submit" nicht mit uebertragen. Der Placeholder verschwindet, wenn man in das Input-Feld clickt.
* fuegt man vor die schliessende Klammer ein "required" ein, dann muss das feld vor einem submit gefuellt sein
=== Checkbox ===
Eine Box zum anclicken...
<input type="checkbox"> Checkbox1
=== Colour Picker ===
Das System-Farbaussuch-Tool...
<input type="color" name="" value="">
=== Email ===
Validiert ob die Email auch das gueltige Email Format hat
<input type="email" name="useremail" value="example@email.com">
=== Password ===
Wandelt die Eingabe in Sternchen...
<input type="password" name="pwd" value="">
=== Radio Button ===
Runde Click buttons... wenn man mehreren den gleichen Namen gibt, dann ist immer nur einer davon aktiv
<label>nr 1
<input type="radio" name="understood" value="">
</label>
<label>nr. 2
<input type="radio" name="understood" value="">
</label>
=== Submit ===
Zum Abschicken eines Formulars...
<input type="submit" name="submit" value="GO GO GO">
=== Text ===
Einfach ein beliebiges Textfeld...
<input type="text" name="eingabefeld" value="Hier bitte auskotzen...">
== Label ==
Feld-Zugehörige Bezeichner...
<label> Gib mir text <input type="text"> </label>
und fuer mehrere Felder...
<label for="userinput">Bitte Eingabe machen</label>
<input id="userinput" name="pwd1" value="Passwort 1">
<input id="userinput" name="pwd2" value="Passwort 2">
== Select ==
Ein kleines Drop-Down-Menu für Auswahlmöglichkeiten
<select name="choice">
<option value="ja">Jaaaa</option>
<option value="nein">Neeee</option>
</select>
== Textarea ==
Ein groessen-bestimmbares Eingabefeld
<textarea name="mytext" rows="8" cols="80"></textarea>

Latest revision as of 09:09, 12 December 2023


Sonderzeichen

Zeichen Code Beschreibung
" &Prime; einfache Anfuehrungszeichen oben (Sekundenzeichen in der Kartographie )
" &ldquo; doppelte anfuehrungszeichen oben / links
" &rdqui; doppelte anfuehrungszeichen oben / rechts
" &bdquo; doppelte anfuehrungszeichen unten
... &hellip; drei Punkte


Button

<button>Klick hier</button>


Embedded JS

<script>

code...

</script

Form

<form class="" action="" method="POST">

</form>

Action kann besielsweise ein link zu ner anderen URL sein, wo dann zum Beispiel der inhalt eines Input angefuegt wird.

INPUT

Allgemein

<input type="field-type" name="field-name" value="default value">

  • Man kann anstelle von "value" auch "placeholder" einsetzen... dann wird es grau anstelle schwarz geschrieben, und bei einem "submit" nicht mit uebertragen. Der Placeholder verschwindet, wenn man in das Input-Feld clickt.
  • fuegt man vor die schliessende Klammer ein "required" ein, dann muss das feld vor einem submit gefuellt sein


Checkbox

Eine Box zum anclicken...

<input type="checkbox"> Checkbox1

Colour Picker

Das System-Farbaussuch-Tool...

<input type="color" name="" value="">

Email

Validiert ob die Email auch das gueltige Email Format hat

<input type="email" name="useremail" value="example@email.com">

Password

Wandelt die Eingabe in Sternchen...

<input type="password" name="pwd" value="">

Radio Button

Runde Click buttons... wenn man mehreren den gleichen Namen gibt, dann ist immer nur einer davon aktiv

<label>nr 1

<input type="radio" name="understood" value="">

</label>

<label>nr. 2

<input type="radio" name="understood" value="">

</label>

Submit

Zum Abschicken eines Formulars...

<input type="submit" name="submit" value="GO GO GO">

Text

Einfach ein beliebiges Textfeld...

<input type="text" name="eingabefeld" value="Hier bitte auskotzen...">


Label

Feld-Zugehörige Bezeichner...

<label> Gib mir text <input type="text"> </label>


und fuer mehrere Felder...

<label for="userinput">Bitte Eingabe machen</label>

<input id="userinput" name="pwd1" value="Passwort 1">

<input id="userinput" name="pwd2" value="Passwort 2">


Select

Ein kleines Drop-Down-Menu für Auswahlmöglichkeiten

<select name="choice">

<option value="ja">Jaaaa</option>

<option value="nein">Neeee</option>

</select>


Textarea

Ein groessen-bestimmbares Eingabefeld

<textarea name="mytext" rows="8" cols="80"></textarea>