Υποενότητα 9.2: Το CSS των φορμών

The required attribute

Ίσως έχετε παρατηρήσει ότι συνήθως, τα υποχρεωτικά πεδία μιας φόρμας έχουν έναν αστερίσκο μετά τον τίτλο.

Για να δημιουργήσουμε αυτό δημιουργούμε  div και του αποδίδουμε μια  class ( στην περίπτωση αυτή η κλάση καλείται "required"). Το div περιλαμβάνει όλα τα άλλα στοιχεία.

Στο CSS, καλούμε την "class required"  και στη συνέχεια, ανάλογα με το στοιχείο που περιέχει τον τίτλο, γράφουμε την κατάλληλη έκφραση. 

Παρατηρήστε ότι εδώ χρησιμοποιούμε την έκφραση element:after αφού ανήκει στα CSS Pseudo Elements. Μια χρήση αυτών των στοιχείων είναι να εισαγάγετε περιεχόμενο πριν ή μετά από ένα στοιχείο

Οι κανόνες CSS rules:

.required label:after { content:"*"; }
.required p:after { content:"*"; }
/*...*/
<div class="required">
  /*The label and input elements*/
<div>

θα δημιουργήσουν μια σελίδα που εμφανίζεται ως: