Nwlapcug.com


Come evidenziare con colori in CSS



Fogli di stile CSS consentono ai progettisti Web di modificare i colori di sfondo e primo piano di elementi HTML. Anche se non è ben noto, è anche possibile utilizzare CSS per modificare il colore di sfondo nel browser viene visualizzata quando si utilizza un mouse per evidenziare il testo. Questo trucco aggiunge un tocco speciale ai vostri disegni e può anche farli più usabile in determinati scenari. Cambiare il colore di evidenziazione richiede CSS3, però. Poiché non tutti i browser supportano CSS3, si dovrebbe aspettare che il browser più vecchi ancora visualizzerà il colore predefinito di evidenziazione.

Istruzioni

1

Aprire la finestra principale. File CSS per il tuo sito Web in un editor di codice. Se il tuo sito Web non utilizza uno, creare ora e aggiungere il codice seguente sotto il tag < title > del tuo sito Web:

< link rel = "stylesheet" type = "text/css" href="path/to/yourstyle.css" / >

Se codificato il tuo sito Web per utilizzare un file di intestazione per l'intero sito, è solo necessario aggiungere tag al file di intestazione. Nel caso di un sito in HTML statico, è necessario aggiungere questa riga di codice in ogni file HTML.

2

Aggiungere il seguente codice al tuo. File CSS per controllare il colore di evidenziazione:

:: selezione {background: #ff5e99;}

:: - moz - selezione {background: #ff5e99;}

: selezione {background: #ff5e99;}

I primi due sono specifici del fornitore righe di codice per ciò che le specifiche CSS3 chiamano "pseudo-classe selection." Browser basati su WebKit Chrome e Safari utilizzare la prima riga di codice, che in questo caso aggiunge un due punti extra. Firefox utilizza la seconda riga di codice, che aggiunge un due punti extra e il "-moz" prefisso fornitore. L'ultimo esempio è il codice che dovrebbe funzionare quando browser diventano totalmente compatibile con CSS3, ma a partire dal 2011 questo non è ancora il caso.

3

Cambiare i sei caratteri dopo il segno di hash per il valore esadecimale del colore di vostra scelta. Utilizzare un selettore colore o grafico a colori, entrambi disponibili gratuitamente online. È inoltre possibile utilizzare nomi di colori come "bianco" o "nero" per i colori di base, ma si consiglia di consultare un grafico per coloro, troppo.

4

Aggiungere i nomi delle classi o ID per i tag HTML e poi usarli come destinazione in CSS da usare diversi colori di evidenziazione su diversi elementi delle pagine web. Ecco un esempio di un paragrafo con un nome di classe di "verde":

< classe p = "green" > testo... </p > verde

È possibile aggiungere il nome della classe "verde" a tutti i tag che vuoi. Utilizzare gli ID quando si desidera solo un tag, ad esempio un tag < p > specifico in una pagina Web di destinazione.

5

Aggiungere il nome della classe o l'ID al foglio di stile CSS a un tag specifico o un gruppo di tag di destinazione. Per rendere i paragrafi dati un nome di classe di "verde" un colore di evidenziazione verde, utilizzare le seguenti operazioni:

p.Green:: selezione {background: #00ff00;}

p.Green:: - moz - selezione {background: #00ff00;}

p.Green: selezione {background: #00ff00;}

Consigli & Avvertenze

  • Abbinare il colore di evidenziazione per la tavolozza dei colori del tuo sito Web per dare un aspetto più "tirato insieme".
  • Giocare con i colori per ottenere la combinazione più leggibile di sfondo del sito, evidenziare il colore e il colore del testo.