Heim > Web-Frontend > HTML-Tutorial > Wie füge ich einem HTML-Formular einen Farbwähler hinzu?

Wie füge ich einem HTML-Formular einen Farbwähler hinzu?

WBOY
Freigeben: 2023-08-31 09:29:09
nach vorne
1291 Leute haben es durchsucht

Wie füge ich einem HTML-Formular einen Farbwähler hinzu?

HTML, was für Hypertext Markup Language steht, ist eine Kombination aus Hypertext und Auszeichnungssprache, die wir zum Erstellen von Webseiten und deren Inhalten verwenden können. In diesem Artikel erfahren Sie, wie Sie mithilfe von HTML einen Farbwähler hinzufügen.

Grammatik

For Output Code pre class
Nach dem Login kopieren

Tags sind interaktive Elemente in HTML, deren Hauptzweck darin besteht, unterschiedliche Eingabeformen vom Benutzer zu erhalten. Das Typattribut des Tags gibt an, welche Art von Eingabe der Benutzer eingeben soll.

Methode

Wir werden das -Tag verwenden. Um dies zu erreichen, erstellen wir ein Eingabe-Tag im Formular und setzen das Attribut „Typ“ auf „Farbe“. Beispiel

Schritt 1

– Zuerst definieren wir den grundlegenden HTML-Code.

<!DOCTYPE html>
<html>
<head>
   <title>How to add color picker in a form using HTML?</title>
</head>
<body>
   <h4>How to add color picker in a form using HTML?</h4>
</body>
</html>
Nach dem Login kopieren

Schritt 2

– Jetzt fügen wir die Formularelemente hinzu.

<form>
   <label>Choose Colour</label>
   <input type="color"/>
</form>
Nach dem Login kopieren
Dies ist der vollständige Code -

<!DOCTYPE html>
<html>
<head>
   <title>How to add a color picker in a form using HTML?</title>
</head>
<body>
   <h4>How to add a color picker in a form using HTML?</h4>
   <form>
      <label>Choose Colour</label>
      <input type="color" />
   </form>
</body>
</html>
Nach dem Login kopieren

Fazit

In diesem Artikel haben wir etwas über

-Tags gelernt. Später haben wir uns auch angeschaut, wie man mithilfe des

-Tags einen Farbwähler zu einem HTML-Formularelement hinzufügt.

Das obige ist der detaillierte Inhalt vonWie füge ich einem HTML-Formular einen Farbwähler hinzu?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:tutorialspoint.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage