Lezione 7. Testo e colore di sfondo in HTML.

Data: 05-12-2008

Come impostare lo sfondo e il colore del testo su una pagina web?

Per impostazione predefinita, il colore del testo e, in generale, qualsiasi carattere sulle pagine web è sempre il nero (#000000 ). Ma possiamo sempre impostare assolutamente qualsiasi colore che ci piace e sembra decente o più adatto alla progettazione di un determinato sito.

Imposta il colore del testo

In HTML, il colore del testo, del carattere, dello sfondo e di altri elementi può essere impostato in due modi:

1. Metodo 1. In coppia tag l'attributo è scritto con il nome del colore desiderato. Il nome del colore è indicato in inglese. Ad esempio, il colore del titolo sulla nostra pagina web può essere impostato in questo modo:

Commenti su questo articolo (lezione):

Andrej! Che bel sito che hai! Lo uso regolarmente ormai dalla seconda settimana: sto studiando le tue lezioni e i tuoi video tutorial; Ho letto la tua letteratura e scaricato programmi; Sto muovendo i primi passi nella programmazione web! E, soprattutto, ce la posso fare!!! E non sono affatto un fisico, ma un paroliere! E chiunque visiti il ​​mio sito letterario può esserne convinto: "POEMS BY OLEG GUZ" I miei dati: e-mail: [email protetta] sito web: http://sites.google.com/site/stihiolegguz/

controlla attentamente il codice

Ho provato a cambiare il colore di sfondo e non funziona! Come cambiare il colore di sfondo?

come cambiare il colore del carattere in html

Se sei almeno un po' esperto di tecnologie web, dovresti sapere che tutto il markup e il contenuto del documento sono contenuti nel file html e gli stili che determinano l'aspetto dei vari elementi sono memorizzati nel file di stile CSS. Quindi, è CSS che dobbiamo usare per cambiare il colore del carattere e tutto il resto.

Ci sono tag in html che ti permettono di applicare determinati effetti al testo, ma devi ammettere che non sarebbe del tutto ragionevole inventare centinaia di tag per ogni sfumatura. In CSS, puoi controllarlo molto più comodamente. Ad esempio, è così che puoi impostare il colore del carattere dell'elemento body html, ovvero il tag che include tutto il contenuto della pagina che viene visualizzato sullo schermo.

corpo (colore: rosso; )

Abbiamo scritto il corpo della pagina in rosso. Lo riceveranno paragrafi, elenchi, intestazioni e tutti gli altri elementi. Questo fino a quando gli stili per questi elementi non verranno sostituiti da altri.

Formati di registrazione a colori

Forse hai una piccola conoscenza nel campo del web design? In questo caso, dovresti essere consapevole che ci sono diverse modalità colore. Ad esempio, rgb, rgba, hsl, hex, ecc. Naturalmente, il modo più semplice per impostare una tonalità è scrivere semplicemente una parola chiave. Abbiamo fatto proprio questo nell'esempio sopra, il rosso rende le lettere rosse, il blu le rende blu e il marrone le rende marroni. Questi sono solo i nomi dei colori in inglese.

L'unica cosa che devi sapere in questo caso è il nome del colore desiderato. Puoi cercarli su Internet in qualsiasi tabella. Il prossimo modo popolare per specificare un colore è annotare il suo codice esadecimale. Questo è il cosiddetto formato esadecimale. Esempi:

p( color: #000; ) /* Il testo nei paragrafi sarà nero. */ table( color: #fff; ) /* Il contenuto nelle tabelle sarà bianco. */

Come puoi vedere, devi annotare il reticolo, dopodiché il codice colore. Come riconoscerlo? Ad esempio, puoi aprire Photoshop o qualsiasi altro editor grafico che visualizzi il suo codice esadecimale quando selezioni un colore. Puoi anche utilizzare il servizio online.

Rgb è un altro popolare formato di registrazione. Sta per semplicemente: rosso, verde, blu. Il colore in questo formato è impostato in questo modo:

#footer(colore: rgb(234, 22, 56); )

L'elemento con id footer otterrà il colore specificato. La proporzione di rosso sarà 234, verde - 22, blu - 56. Questi valori possono essere scritti da 0 a 255. Di conseguenza, la nostra tonalità risulterà più vicina al rosso. In Paint, puoi aggiungere colori alla tavolozza modificando la saturazione dei tre colori primari.

Il vantaggio di questo metodo è che puoi scegliere tra milioni di colori semplicemente cambiando tre numeri. Quando scrivi con le parole chiave, avrai solo poche centinaia di colori nel tuo arsenale.

Rgba - testo traslucido!

Sì, questa è una nuova modalità di registrazione, presente negli editor grafici da molto tempo, ma è apparsa nel web design relativamente di recente. Si scrive così:

a( rgba(255, 12, 22, 0.5); )

L'ultimo numero nella voce specifica la trasparenza. Può essere scritto da 0 a 1, dove 1 è testo completamente opaco, che è il comportamento predefinito. In questo caso, tutti i collegamenti diventeranno rossi, ma a causa della trasparenza, la luminosità del colore sarà molto inferiore e se è presente un altro sfondo o elemento sotto il collegamento, sarà visibile.

Modo sbagliato per impostare il colore

HTML ha un attributo di colore deprecato ed era possibile scrivere il colore del testo usando una parola chiave con esso. Ora questo potrebbe non funzionare nemmeno nei browser moderni e in generale questo metodo viola gli standard web generalmente accettati. Ed è anche a disagio.

Come definire un colore per un frammento arbitrario

Ok, stiamo parlando del colore del carattere per paragrafi, collegamenti e tabelle, ma questi sono elementi solidi, ma cosa succede se hai bisogno di definire un colore per una frase, una parola, una lettera, dopo tutto?

Racchiudiamo semplicemente il frammento desiderato in tag span. Scriviamo l'attributo class all'interno del tag, a cui impostiamo un valore arbitrario, ma comprensibile. Ad esempio, in questo modo:

Tutto, ora non resta che fare riferimento al selettore in css.

Quando si crea una pagina web, si devono affrontare vari problemi di progettazione. Una domanda comune è come cambiare il colore del testo in HTML. Risolverlo è abbastanza semplice, mentre ci sono due modi diversi.

Imposta un attributo di stile di testo in linea

Per capire come cambiare il colore del testo in HTML, basta guardare l'elenco degli attributi del campo di testo. Tra questi ci sono una serie di valori che definiscono lo stile del testo racchiuso in questi tag, che sono specificati all'interno della parola chiave style.

Per cambiare il colore del testo è sufficiente inserire la parola style="" nella sezione selezionata del campo di testo all'interno del tag di apertura. All'interno di questo attributo, puoi specificare diversi valori di parametro: il valore dell'attributo color è responsabile della modifica della tonalità di colore del testo. Specificando questo parametro, dopo il segno dei due punti, è necessario specificare il colore con cui verranno dipinti tutti i caratteri di questo campo. Allo stesso tempo, quando si definisce una tonalità, è possibile specificare un valore di colore esplicito, ad esempio rosso o giallo, oppure il suo valore esadecimale o rgb.

Indipendentemente dal metodo di definizione del colore selezionato, il risultato sarà lo stesso se viene selezionata la stessa tonalità. Pertanto, tutti e tre gli esempi seguenti apporteranno la stessa modifica al testo: coloralo di giallo.

1.

testo

2.

testo

3.

testo

Cambia colore usando CSS

L'utilizzo di un foglio di stile consente inoltre di decidere come modificare il colore del testo in HTML. CSS è completamente supportato da tutte le versioni moderne di HTML e ti consente anche di modificare lo stile di più elementi di pagina contemporaneamente.

Per capire come cambiare il colore del testo in HTML con CSS, non è necessario comprendere un linguaggio di definizione dell'aspetto formale. Per definire gli attributi di qualche elemento, devi creare una descrizione CSS che viene scritta all'interno del tag , ed è definito dal tag