Preistabelle für die Website (Tarife in HTML und CSS)
Schreibe die Tarife in das Feld: eine Zeile mit Name und Preisen und darunter die Punkte. Markiere die Hervorhebung mit * im Namen.
So geht’sTarife nebeneinander, der beste hervorgehoben
Verfügbar auf: 
Preistabelle für die Website (Tarife in HTML und CSS): wofür es gut ist
Ein gut gebauter Tarifbereich hilft dem Besucher beim Vergleichen und Auswählen. Schreibe jeden Tarif mit Name, Monatspreis, Jahrespreis, Button und den enthaltenen (+) und nicht enthaltenen (-) Punkten und markiere die Hervorhebung mit einem Sternchen.
Der Code ist responsiv, mit leicht erhöhtem Tarif mit Siegel, Symbolen für enthalten und nicht enthalten (mit Text für Screenreader) und einem Schalter monatlich/jährlich nur mit CSS und Optionsfeldern. Passe Farbe, Währung und Siegeltext an.
So geht’s
- Schreibe die Tarife und die Punkte.
- Markiere den hervorgehobenen Tarif und passe die Farben an.
- Kopiere den Code.
Wann nutzen
- Abo-Tarife.
- Leistungspakete.
- Tarife für Fitnessstudio oder Kurs.
Häufige Fragen
Wie schreibe ich die Tarife?
Jeder Tarif beginnt mit einer Zeile „Name | Monatspreis | Jahrespreis | Buttontext | Link“. Die folgenden Zeilen, die mit + oder - beginnen, sind die enthaltenen und nicht enthaltenen Punkte. Lass zwischen den Tarifen eine Leerzeile. Setze * vor den Namen des Tarifs, der hervorgehoben werden soll.
Wie funktioniert der Schalter monatlich/jährlich?
Wenn du den Jahrespreis ausfüllst, erscheint ein Schalter, mit dem der Besucher wechseln kann. Er funktioniert mit CSS und Optionsfeldern, ohne JavaScript, und beide Preise stehen im HTML.
Wie viele Tarife zeigen?
Drei sind am gängigsten: Der mittlere, hervorgehobene wird meist am häufigsten gewählt. Bei mehr als vier wird der Vergleich schwierig; dann funktioniert eine Vergleichstabelle besser.
Ist das wirklich kostenlos?
Ja, 100% kostenlos. Ohne Anmeldung, ohne Abo und ohne Nutzungslimit. Alle Tools von Tools123 sind kostenlos.