6 risposte
Come le altre risposte, eredita la proprietà CSS da elemento padre.
Ciò che le altre risposte non sono riuscite a dire è perché ne hai bisogno. Perché alla fine proprietà CSS sono comunque ereditati, giusto?
Oh no. La maggior parte di essi sono per impostazione predefinita (ma il colore del collegamento non viene ereditato dall'elemento padre, ad esempio). Ma considera questo caso:
P ( colore: blu; ) div.important ( colore: rosso; )
Questo è un testo
Ora il testo sarà blu anziché rosso. Se vogliamo
Avendo lo stile dei suoi genitori e non lo stile predefinito, dobbiamo sovrascriverlo con CSS. Certo, potremmo ripetere il valore della proprietà (rosso), ma questo interrompe DRY (non ripetere te stesso). Invece, ereditiamo da esso:
Div.important p ( colore: ereditare; )
La dichiarazione font:inherit viene utilizzata in molti fogli di stile CSS Reset che vengono spesso copiati in varie librerie e framework. L'originale Reset CSS di Eric Meyer ha font:inherit . Non viene fornita alcuna motivazione specifica. Si dice che la logica generale sia "ridurre le incoerenze del browser in cose come l'altezza delle linee predefinite, i margini dell'intestazione e le dimensioni dei caratteri, ecc." Ma Meyer fa riferimento a un post precedente in cui spiega l'idea, dicendo, tra l'altro: "Voglio tutto questo perché non voglio dare per scontati effetti di stile. Serve a due scopi: primo, mi fa pensare a , che è un po' più complicato nella semantica del mio documento. usando il ripristino Non scelgo forte perché il design richiede audacia. Invece scelgo elemento corretto- che sia forte o em o b o h3 o altro - e poi cancellalo se necessario."
Diversi elementi HTML hanno il rendering predefinito nei browser rispetto alle proprietà dei caratteri: intestazioni, campi modulo, celle di intestazione di tabella, alcuni elementi di frase e così via. Utilizzo dei CSS Reset , o in particolare font: inherit , significa che nei browser che supportano inherit , tutti questi elementi sono visualizzati in carattere del testo copia se non diversamente specificato nel foglio di stile.
Così, noi stiamo parlando sulla metodologia specifica (o, come dicono alcuni, ideologia o religione) della paternità e del design. Ha guadagnato popolarità ed è spesso usato regolarmente.
Non tutti i browser ereditano le proprietà dei caratteri per tutti gli elementi. Netscape 4.x è notoriamente pessimo per quanto riguarda l'ereditarietà. Considera il seguente stile:
Corpo (sfondo: nero; colore: bianco)
In Netscape 4.x, non è stato applicato alcun colore agli elementi della tabella, quindi per impostazione predefinita otterrai testo nero all'interno della tabella su sfondo nero.
Le proprietà dei caratteri hanno lo stesso tipo di accordo per alcuni elementi, in particolare gli elementi dei moduli (e gli elementi delle tabelle per i browser meno recenti). Non è raro vedere questa definizione:
Tabella, modulo ( font: eredita )
inherit viene utilizzato per ottenere proprietà da un elemento padre. In altre parole, eredita le proprietà dell'elemento padre.
Per impostazione predefinita, la proprietà è ereditaria, il che significa che hai div e p.
Ciao mondo!
Ora dai stile:
Div (famiglia di caratteri: Tahoma;) p (famiglia di caratteri: ereditare;)
Questa famiglia di caratteri è uguale a ereditata per p dal suo genitore elemento div.
L'uso di (font:inherit;) in CSS ha senso perché diversi programmi utente (browser alias) hanno un foglio di stile agente utente (leggi: foglio di stile predefinito) con qualcosa di simile
Corpo ( font: -magic-font-from-user-preferences; ) textarea, input ( font: monospace; )
(font:ereditare;) viene utilizzato per ignorare occasione speciale quando il font o la famiglia di font predefiniti non vengono ereditati a causa del foglio di stile del programma utente, ma l'autore del contenuto desidera che la famiglia di font venga ereditata.
Il comportamento effettivo di un programma utente con un valore ereditario è purtroppo diverso da vari errori. Tuttavia, il risultato potrebbe essere più vicino all'intento dell'autore rispetto al valore predefinito.
Opzioni dei caratteri
Iniziamo con gli attributi di stile che impostano i parametri del font in cui viene digitato il testo. Dopotutto, il testo nelle pagine Web è il capo di tutto.
L'attributo font-family style specifica il nome del carattere in cui verrà visualizzato il testo:
famiglia di font: <список имен шрифтов, разделенных запятыми> |ereditare
I nomi dei caratteri vengono specificati come nomi dei caratteri, ad esempio Arial o Times New Roman. Se il nome del carattere contiene spazi, deve essere racchiuso tra virgolette:
P (famiglia di caratteri: Arial)
H1 (famiglia di caratteri: "Times New Roman" )
Se dato attributo lo stile è presente nello stile inline, le virgolette vengono sostituite con apostrofi:
Se il carattere che abbiamo specificato è presente sul computer del visitatore, programma di navigazione in rete lo usa. Se non esiste un font di questo tipo, il testo viene visualizzato nel font specificato nelle impostazioni predefinite. E la nostra pagina Web potrebbe non avere l'aspetto che volevamo. (Tuttavia, i caratteri Arial e Times New Roman sono presenti su qualsiasi computer che esegue Windows.) È possibile specificare più nomi di caratteri separati da virgole:
P ( famiglia di caratteri: Verdana, Arial )
Quindi il browser Web cercherà prima il primo dei caratteri specificati, in caso di ricerca non riuscita: il secondo, quindi il terzo, ecc. Invece del nome carattere specifico puoi nominarne uno famiglie di caratteri, che rappresentano interi set di caratteri simili. Esistono cinque famiglie di questo tipo: serif (caratteri serif), sans-serif (caratteri sans-serif), corsivo (caratteri simili alla scrittura a mano), fantasy (caratteri decorativi) e monospace (caratteri monospace):
H2 (famiglia di caratteri: Verdana, Arial, sans-serif)
Il valore speciale ereditare specifica che il testo di questo elemento della pagina Web deve essere nello stesso carattere del testo dell'elemento padre. Lo dicono dentro questo caso un elemento di una pagina Web "eredita" il carattere dal suo elemento padre. Questo è, tra l'altro, il valore predefinito dell'attributo font-family style. L'attributo stile font-size definisce la dimensione del carattere:
dimensione del font: <размер >|xx-piccolo|x-piccolo|piccolo|medio|grande|x-grande|xx-grande|più grande|piccolo|ereditare
La dimensione del carattere può essere impostata in valori assoluti e relativi. Per questo, uno dei unità di misura supportato dai CSS (Tabella 8.1).
Tabella 8.1. Unità di misura supportate dallo standard CSS
La designazione dell'unità di misura selezionata è indicata dopo il valore stesso:
P (dimensione carattere: 10pt) FORTE (dimensione carattere: 1 cm) EM (dimensione carattere: 150%)
Si noti che tutto il tavolo. Le unità 8.1 sono adatte per impostare i valori di altri attributi di stile CSS.
Oltre al numerico attributo font-size può anche assumere valori caratteriali. Pertanto, i valori da xx-small a xx-large definiscono sette dimensioni dei caratteri predefinite, dal più piccolo al più grande. E i valori più grandi e più piccoli rappresentano la dimensione del carattere successiva, rispettivamente, in ordine crescente e decrescente. Ad esempio, se l'elemento padre ha una dimensione del carattere di media, un valore maggiore imposterà la dimensione del carattere dell'elemento corrente su grande.
Il valore ereditario specifica che questo elemento della pagina Web deve avere la stessa dimensione del carattere dell'elemento padre. Questo è il valore predefinito dell'attributo stile font-size.
L'attributo stile colore imposta il colore del testo:
colore: <цвет> |ereditare
V capitolo 7 abbiamo detto che il colore può essere specificato dal cosiddetto codice RGB (rosso, verde, blu - rosso, verde, blu). È scritto nel formato
#<доля красного цвета><доля зеленого цвета><доля синего цвета> ,
dove sono date le proporzioni di tutti i colori come numeri esadecimali da 00 a FF. Imposta il colore del testo su rosso:
H1 (colore: #FF0000) E ora colore grigio: INDIRIZZO ( colore: #CCCCCC )
Inoltre, CSS ti consente di specificare i colori per nome. Quindi il nero è nero, il bianco è bianco, il rosso è rosso, il verde è verde e il blu è blu.
H1 (colore: rosso)
Un elenco completo dei nomi e dei colori corrispondenti è disponibile nella pagina Web http://msdn.microsoft.com/en-us/library/aa358802%28v=VS.85%29.aspx .
Il valore ereditario specifica che questo elemento della pagina Web deve avere lo stesso colore del carattere dell'elemento padre. Questo è il valore predefinito dell'attributo stile font-size.
ATTENZIONE!
Il valore ereditario è supportato da quasi tutti gli attributi stile CSS. Indica al browser Web che l'elemento della pagina Web a cui è associato lo stile "eredita" il valore del parametro corrispondente dall'elemento padre. Tutti gli attributi hanno questo valore predefinito. In quanto segue, non descriveremo dato valore per ogni attributo di stile; se qualche attributo di stile non lo supporta, lo menzioneremo specificamente.
Con l'attributo stile colore, possiamo, ad esempio, impostare il colore linea orizzontale HTML.
L'attributo stile opacità consente di specificare il grado di traslucenza di un elemento di una pagina Web:
opacità:<числовое значение>|ereditare
Il valore di traslucenza è un numero da 0 a 1. Dove 0 significa piena trasparenza element (cioè l'elemento non è effettivamente visibile) e 1 è la piena opacità (questo è un comportamento normale).
Ecco un esempio di impostazione della semitrasparenza (valore 0,5) per il testo a formattazione fissa:
PRE (opacità: 0,5)
Nota, come abbiamo indicato numero frazionario- invece di una virgola, qui viene utilizzato un punto.
SU UNA NOTA
La traslucenza di solito è utile solo per creare effetti speciali. V testo normale se ne sconsiglia l'uso, perché potrebbe scoraggiare il visitatore.
L'attributo dello stile del peso del carattere imposta il "peso" del carattere:
font-weight: normale|grassetto|grassetto|più chiaro|100|200|300|400|500|600|700|800|900|ereditare
Sono qui disponibili sette valori assoluti, da 100 a 900, che rappresentano diversi “pesi” del font, dal minimo al massimo; in questo caso, il carattere normale avrà un "peso" di 400 (o normale) e grassetto - 700 (o grassetto). Il valore predefinito è 400 (normale). I valori più audaci e più chiari sono relativi e rappresentano rispettivamente i successivi gradi di "audacia" su e giù.
CODICE ( peso del carattere: grassetto )
L'attributo font-style specifica lo stile del carattere:
font-style: normale|corsivo|obliquo|ereditare
Sono disponibili tre valori, che rappresentano il carattere regolare (normale), il corsivo (corsivo) e uno speciale stile decorativo simile al corsivo (obliquo).
L'attributo di stile della decorazione del testo specifica la "decorazione" (sottolineata o barrata) da applicare al testo:
decorazione del testo: nessuno|sottolineato|sopralineato|line-through|blink|ereditare
Ci sono cinque valori disponibili qui (senza contare ereditare):
Nessuno rimuove tutte le "decorazioni" date al carattere dell'elemento genitore;
La sottolineatura sottolinea il testo;
Overline "sottolinea" il testo, cioè traccia una linea sopra le linee;
La riga passa attraverso il testo;
Blink fa sfarfallare il carattere (on questo momento non supportato da Safari).
ATTENZIONE!
Non sottolineare il testo a meno che non sia assolutamente necessario. Questo perché i browser Web rendono i collegamenti ipertestuali sottolineati per impostazione predefinita e il testo sottolineato senza collegamenti ipertestuali può scoraggiare il visitatore.
L'attributo stile font-variant consente di specificare come minuscolo font:
font-variant: normal|small-caps|eredita
Il valore in maiuscolo specifica il comportamento del carattere in modo che le sue lettere minuscole appaiano esattamente come le lettere maiuscole, hanno solo taglia più piccola. Il valore normal imposta il carattere su lettere maiuscole regolari.
L'attributo di stile di trasformazione del testo consente di modificare il caso dei caratteri di testo:
trasformazione del testo: capitalizza|maiuscolo|minuscolo|nessuno|eredita
Possiamo convertire il testo in maiuscolo (il valore maiuscolo di questo attributo) o minuscolo (minuscolo), convertire la prima lettera di ogni parola in maiuscolo (maiuscolo) o lasciarlo così com'è (nessuno).
L'attributo di stile dell'altezza della linea imposta l'altezza di una riga di testo:
altezza della linea: normale| <расстояние> |ereditare
Qui puoi impostare l'assoluto e valore relativo distanza, specificando l'unità appropriata Dimensioni CSS(vedi tabella 8.1). Se è assente, il valore che impostiamo viene prima moltiplicato per l'altezza del font corrente e quindi utilizzato. Quindi, per raddoppiare l'altezza di una riga, possiamo scrivere:
P ( altezza della linea: 2 )
Il valore normale di questo attributo restituisce il controllo dell'altezza della riga al browser Web.
L'attributo dello stile di spaziatura delle lettere consente di impostare una spaziatura aggiuntiva tra i caratteri di testo:
spaziatura delle lettere: normale| <расстояние>
Si noti che questa è precisamente la distanza aggiuntiva; verrà aggiunto a quello originale impostato dal browser Web stesso.
Qui puoi anche impostare la distanza assoluta e relativa specificando l'unità CSS appropriata (vedi Tabella 8.1). La distanza può essere positiva o negativa; v ultimo caso i caratteri dei caratteri saranno posizionati più vicini tra loro del solito. Il valore normale imposta la distanza aggiuntiva predefinita su zero.
L'attributo di stile di spaziatura tra lettere non supporta il valore di ereditarietà.
Ecco un esempio di impostazione di una distanza aggiuntiva tra i caratteri pari a cinque pixel:
H1 (spaziatura lettere: 5px)
Il testo digitato con tali caratteri apparirà sparso.
E qui abbiamo impostato una spaziatura aggiuntiva negativa tra i caratteri pari a due pixel:
H6 (spaziatura lettere: -2px)
Questi due pixel verranno sottratti dalla distanza originale, facendo avvicinare i caratteri e il testo apparirà compresso. Forse i personaggi si adatteranno anche uno sopra l'altro.
Attributo simile Lo stile di spaziatura delle parole imposta lo spazio extra tra le singole parole di testo:
spaziatura delle parole: normale| <расстояние>
H1 (spaziatura tra le parole: 5 mm)
Beh, 5 mm sono forse un po' troppi... Anche se questo è solo un esempio.
Infine, considera l'attributo dello stile del carattere, che ti consente di impostare diversi parametri del carattere contemporaneamente:
carattere: [ <начертание> ] [<вид строчных букв> ] [<"жирность"> ] [<размер> ] <имя шрифта>
Come puoi vedere, è richiesto solo il nome del carattere - altri parametri potrebbero essere assenti.
Imposta il testo dei paragrafi sul font Times New Roman con una dimensione di 10 punti:
P (carattere: 10pt "Times New Roman")
E per i titoli di sesto livello - carattere Arial di dimensione 12 punti e corsivo:
H6 (carattere: corsivo 12pt Verdana)
Spesso, quando consegniamo un progetto a un cliente, perdiamo il controllo del codice HTML. A volte il cliente utilizza i CMS (Content Management Systems) che gli danno pieno controllo sopra alcune parti del codice HTML. A volte un cliente utilizza semplicemente i nostri modelli per inviare il proprio codice a un documento.
Nella maggior parte dei casi, è abbastanza difficile informare il cliente su come utilizzare i modelli o i CMS che gli vengono forniti e talvolta è semplicemente inaccettabile fare discorsi infuocati sul layout semantico e sugli standard web. Il cliente può/volerà usare il "buon vecchio markup", quello che conosce, semplicemente perché funziona e ha l'aspetto a cui è abituato. Molto probabilmente conterrà tag e attributi indesiderati (obsoleti), come bgcolor, allinea ed "eterno" font. Questo articolo spiega come bloccare i tag HTML indesiderati con usando CSS guidando così dolcemente il cliente nella giusta direzione.
Ci sono diverse soluzioni al problema. Uno di questi sta visualizzando un'immagine di avviso con CSS quando vengono utilizzati tag indesiderati. Ci sono spiegazioni dettagliate di questo metodo e. La seconda soluzione è "eliminare" i tag e gli attributi indesiderati sul lato server. Questo metodo è il più efficace, un'altra cosa è che non c'è sempre il controllo sul server in cui si trova il sito.
L'idea è di preservare la cascata naturale e l'eredità degli stili su tutti i browser "disabilitando" elegantemente l'HTML che il client non vuole utilizzare. E poi il client smetterà di usarlo, perché i tag indesiderati smetteranno semplicemente di "funzionare". Un modo elegante e non irritante per il cliente, che lo guiderà sulla retta via.
Tag e attributi HTML indesiderati:
Soluzione
Idealmente, potremmo semplicemente aggiornare alcuni dei tag HTML inserendo il valore ereditare per la proprietà CSS equivalente. I browser che seguono gli standard ignoreranno semplicemente gli attributi indesiderati specificati nel codice e utilizzeranno invece i valori ereditati nella cascata.
Ad esempio questo CSS:
carattere ( colore:ereditare; )
sovrascriverà questo codice:
Blu
Di conseguenza, il colore del testo all'interno del tag font sarà un colore a cascata, non blu come specificato nel codice. Quello di cui hai bisogno. Ma come probabilmente saprai, Internet Explorer ci sono problemi con i valori ereditati. E anche nella settima versione. Allora mettiti al lavoro:
Espressioni e stile attuale in soccorso:
font(colore:ereditare; /* Browser normali*/ color:expression(this.parentNode.currentStyle["color"]); /* CIOÈ */ )
Lavorando? Va bene, andiamo avanti:
font ( font-family:inherit; /* Browser normali */ font-family:expression(this.parentNode.currentStyle["fontFamily"]); /* IE */ )
Tutto è meraviglioso, tranne per il fatto che Opera 9 non ne eredita il valore famiglia di font. per fortuna font siamo inoltre soddisfatti di:
font ( font:inherit; /* Browser normali */ font-family:expression(this.parentNode.currentStyle["fontFamily"]); /* IE */ )
Ho risolto. Andiamo alla proprietà dimensione del font. Ciò richiede delicatezza, poiché il valore della dimensione del carattere viene ereditato in relazione al valore calcolato (calcolato). Precedente espressione"S non funzionerà qui, perché se per corpo valore della proprietà impostato dimensione del font uguale a 2em, da questo punto partirà il calcolo del valore della dimensione del carattere. Il browser verificherà il valore dimensione del font per l'elemento padre del tag font, che è uguale a 2em e rappresenterà un valore calcolato pari a 4em (2em da 2em). E non è quello di cui abbiamo bisogno. La soluzione è semplice. Necessità di usare valore iniziale dimensione del font, pari al 100% per tutti i browser. Aggiungiamo alcune proprietà al tag indesiderato carattere di base per tranquillizzarlo. Qui lista completa regole per "addomesticare" i tag font e carattere di base:
font,basefont ( color:inherit; /* Browser normali */ color:expression(this.parentNode.currentStyle["color"]); /* IE */ font:inherit; /* Browser normali. Font invece di font-size for Operas */ font-family:expression(this.parentNode.currentStyle["fontFamily"]); /* IE */ font-size:100%; /* Tutti i browser. Le dimensioni vengono ereditate */ )
Andiamo avanti. Approfittiamo tecnica di base per annullare i tag centro, s, sciopero e tu:
center ( text-align:inherit; /* Browser normali */ text-align:expression(this.parentNode.currentStyle["textAlign"]); /* IE */ ) s,strike,u ( text-decoration:inherit; /* Browser normali */ text-decoration:expression(this.parentNode.currentStyle["textDecoration"]); /* IE */ )
E 'fatto! Abbiamo "disabilitato" la maggior parte dei tag indesiderati utilizzando solo CSS ed espressioni.
Ma per quanto riguarda gli attributi? HTML4 include una serie di attributi indesiderati che possono darti sui nervi. Spegniamo anche loro. Iniziamo con allineare:
* ( text-align:ereditare; ) /* Browser normali */
Va tutto bene, ma IE6 non supporta i selettori di attributi. Pertanto, dobbiamo modificare espressione, in modo da verificare la presenza di un attributo allineare al cartellino. Ecco cosa è successo:
* ( text-align:inherit; ) /* Browser normali */ * ( text-align:expression(this.align ? this.parentNode.currentStyle["textAlign"] : ""); ) /* IE */
I prossimi nella riga sono gli attributi dei tag. img. Oltre l'attributo allineare, vogliamo disabilitare gli attributi bordo, vspace e hspazio. Poiché i valori margine e confine non vengono ereditati, qui si applica una semplice regola:
img ( margin:0; border:none; ) /* Tutti i browser */
È qui che ci imbattiamo in un problema irrisolvibile per IE6. vspace e hspazio la proprietà non è uguale margine in esso, quindi IE6 continuerà a visualizzarli. Unica decisione, che mi è venuto in mente è di scrivere un piccolo script che rimuoverà semplicemente questi attributi quando il documento verrà caricato:
window.onload = function() ( for (i=0;i document.getElementsByTagName("img")[i].removeAttribute("vspace"); document.getElementsByTagName("img")[i].removeAttribute("hspace"); "); ) )
Preferirei non usarlo javascript, ma in questo caso non vedo altre alternative. Quindi lascia che sia. Ora finiamo l'attributo genere nell'etichetta ol:
ol ( tipo-stile-elenco:decimale; ) /* Tutti i browser */
E ora l'attributo bgcolor per corpo:
body ( background-color:transparent; ) /* Tutti i browser */
Tabelle. Passo finale. Nelle tabelle, in HTML4/4.01, sono presenti numerosi attributi indesiderati che sono stati utilizzati attivamente per il layout della pagina. Ma non vogliamo che il cliente utilizzi le tabelle per il layout, vero? Quindi disattiviamo gli attributi larghezza, altezza, bgcolor, valign e confine:
table,tr,th,td ( width:auto; /* Tutti i browser */ height:auto; /* Tutti i browser */ background-color:transparent; /* Tutti i browser */ vertical-align:inherit; /* Tutti i browser (incluso IE) */ border:none; /* Tutti i browser */ )
Riassumiamo:
Usando le regole CSS e javascript minimo, siamo stati in grado di "disabilitare" la maggior parte dei tag e degli attributi indesiderati preservando elegantemente l'ereditarietà naturale. Non abbiamo bisogno di "insegnare" al cliente, dovrà comunque usare il markup corretto. Data un'osservazione molto importante: è molto importante fornire al cliente un numero sufficiente di classi CSS descritte in modo che non sia limitato a lavorare con il markup.
Tutti gli stili insieme:
font,basefont ( color:inherit; /* Browser normali */ color:expression(this.parentNode.currentStyle["color"]); /* IE */ font:inherit; /* Browser normali. Font invece di font-size for Operas */ font-family:expression(this.parentNode.currentStyle["fontFamily"]); /* IE */ font-size:100%; /* Tutti i browser */ ) center ( text-align:inherit; / * Browser normali */ text-align:expression(this.parentNode.currentStyle["textAlign"]); /* IE */ ) s,strike,u ( text-decoration:inherit; /* Browser normali */ text-decoration : expression(this.parentNode.currentStyle["textDecoration"]); /* IE */ ) * ( text-align:inherit; ) /* Browser normali */ * ( text-align:expression(this.align ? this. parentNode .currentStyle["textAlign"] : ""); ) /* IE */ img ( margin:0; border:none; ) /* Tutti i browser */ ol ( list-style-type:decimal; ) /* All browser */ body ( background-color:transparent; /* Tutti i browser */ ) table,tr,th,td ( width:auto; /* Tutti i browser */ height:auto; /* Tutti i browser */ background-color: trasparente; /* Tutti i browser */ vertical-align:herit; /* Tutti i browser (incluso IE) */ border:none; /* Tutti i browser */ )
Traduzione gratuita e preparazione di un articolo basato sui materiali
Sebbene alcune funzioni in css vengono ereditati automaticamente, ci possono essere situazioni in cui è necessario aumentare il peso della proprietà ereditata. Specifica di un valore ereditario per qualsiasi proprietà css applicato a un elemento passerà il valore calcolato della proprietà dell'elemento padre dato elemento. Specificando nello stile dell'autore che una proprietà eredita il suo valore da un predecessore, puoi aumentarne il peso.
Eredita il supporto in Internet Explorer
Internet Explorer 7 e versioni successive prime versioni non supportano un valore ereditario per tutte le proprietà eccetto direzione e visibilità.
In genere, in assenza di definizioni applicabili, il colore è una proprietà ereditata. Tuttavia, se l'elemento è un puntatore, la proprietà color è generalmente impostata su blu, lo stile del browser dell'utente. Se si desidera enfatizzare l'importanza dell'ereditarietà del valore, è possibile utilizzare il valore ereditato in un foglio di stile dell'autore o dell'utente che sovrascrive le definizioni di stile del browser. In basso prossimo esempio, impostiamo la proprietà color dell'elemento p su #000 o nero e specifichiamo che qualsiasi figlio del puntatore dovrebbe ereditare il valore del colore dell'elemento genitore:
P ( colore: #000; ) p a: collegamento ( colore: eredita; )
Quando usiamo una scorciatoia come background , non possiamo mescolare ereditare con altri valori. Ad esempio, le seguenti dichiarazioni di background non sono corrette:
P ( sfondo: #fff eredita in alto a sinistra; }
In questo caso, possiamo sperare che questo elemento erediti la proprietà background-image del genitore. Sfortunatamente, saremmo sfortunati, perché. ereditare deve essere un valore specifico nella definizione. Nell'esempio precedente, l'ereditarietà è ambigua, può essere una proprietà dell'immagine di sfondo o dell'allegato dello sfondo e il browser dell'utente non può determinare a quale proprietà associarla. Per usare ereditare dobbiamo usare l'ortografia completa invece della stenografia. In questo caso, dobbiamo specificare la proprietà background-image.
