April 18
Potrebbe essere visto caselle colorate sul Web e si chiese come gli sviluppatori li ha creati. Il segreto sta nel saper utilizzare i CSS per rendere le pagine web appaiono come più ti piace. Se si vuole attirare l'attenzione su una casella di controllo, forse ruotando il suo sfondo rosso e lo circonda con un bordo 10 pixel, sei libero di farlo, una volta che si impara alcune regole CSS per lo styling.
Cambiare il colore, dimensioni, posizione e altre proprietà degli oggetti delle pagine web, modificando i valori degli attributi CSS. CSS, acronimo di Cascading Style Sheets, permette di creare classi CSS che definiscono queste proprietà. elementi della pagina possono quindi fare riferimento a una classe CSS per nome. Se una casella di controllo sui vostri riferimenti pagina web questa classe CSS, acquisisce le proprietà definite nella classe si è creato. Separando lo stile di un elemento della pagina dal codice HTML che crea l'elemento, fate il codice più semplice e più facile da mantenere. Per esempio, se avete bisogno di cambiare il colore del testo di tutte le caselle di testo dal giallo al verde, un giorno, è sufficiente cambiare la parola "giallo" a "verde" in una singola classe CSS. Tutte le caselle di controllo che fanno riferimento alla classe mostreranno testo verde.
Una casella di controllo è un controllo di input HTML. Il tag input HTML può creare una varietà di controlli unici. È possibile utilizzarlo per creare una casella di testo o di un pulsante, oltre a una casella di controllo. Gli sviluppatori mettono caselle di controllo sulle pagine web al fine di raccogliere informazioni dai visitatori del sito. Una casella di controllo, che ha uno stato controllato e incontrollato, è il perfetto controllo da utilizzare quando avete bisogno di un utente a fare un sì o no la decisione. Quando si aggiunge una casella di controllo a una pagina, acquisisce uno stile predefinito. La scatola ha una forma quadrata di serie, non ha colore di sfondo e il colore del testo è nero. Molti sviluppatori sono contento di questo aspetto se le loro caselle di controllo non giocano alcun ruolo di primo piano sulla pagina web. Si può, tuttavia, desidera richiamare l'attenzione su una casella di controllo particolare o semplicemente per ravvivare la tua pagina web con grafica di fantasia, colori e stili dei caratteri. È possibile effettuare questa operazione styling tue caselle di controllo.
Gli sviluppatori creano classi CSS da loro creazione nella sezione stile di una pagina web, come mostrato nel seguente esempio:
.redFontWithBorder {background-color: red; border-style: solido; border-width: 2px; }
Questa classe denominata ".redFontWithBorder" definisce le proprietà CSS necessarie per aggiungere un bordo intorno a un elemento della pagina e cambiare il suo carattere di colore rosso. È quindi possibile aggiungere questo riferimento di classe a una casella di controllo come segue:
<Input type = "checkbox" class = "redFontWithBorder" />
Quando un browser visualizza questa casella, la casella di controllo acquisirà le proprietà di stile definite dalla classe CSS. Molti altri attributi CSS esistono, tra cui background-color, font-size, font-family e border-width. È anche possibile utilizzare la larghezza e l'altezza CSS attributi per impostare le dimensioni di una casella di controllo. Mescolare diversi attributi CSS per creare lo stile che si adatta alle proprie esigenze.
Il Consorzio Mondiale Internet, organo di governo di Internet, elenca sette "pseudo-classi" si può anche utilizzare per caselle di controllo di stile. Queste classi sono ": attivo," ": focus", ": hover," ": abilitato," ": disabili," ": indeterminato" e ":. Controllato" Una casella di controllo può avere più stati. Quando i visitatori del sito aprono una pagina web contenente il casella di controllo, che vedono di stile predefinito del casella di controllo o qualsiasi stile si è creato per la casella di controllo. Quando un utente controlla la casella di controllo, i suoi cambiamenti di stato a "controllati". Quando un utente passa il cursore del mouse su una casella di controllo, la casella di controllo acquisisce uno stato "hover". La disattivazione di una casella di controllo conferisce uno stato di "disabile". Utilizzando uno dei sette pseudo-classi, è possibile effettuare le caselle di controllo mostrano stili diversi in base al loro stato attuale.