Rendere ogni lettera di un nome di colore diverso.

[Aleandro23]

Creare una pagina html contenente il vostro nome e cognome. Utilizzando CSS fate in modo che ogni lettera sia grande 36 punti, venga usato un font senza grazie e venga colorata in maniera differente dalle altre. Io ho fatto così: p{font-size:36pt;font-family:arial;}. Come faccio adesso a colorare le lettere in maniera differente dalle altre? Grazie a tutti in anticipo per le risposte.

[Prill]

Se fosse solo la prima lettera di un elemento potresti usare il selettore :first-letter. Trattandosi invece di un colore diverso per ciascuna lettera, coi soli css credo non vi sia altra soluzione che inserire ogni lettera in uno span con id diverso a cui attribuirai un colore differente

[carlomarangoni]

Piccolo esempio:

<FONT FACE="Arial" SIZE="6"><FONT COLOR="#FF0000">T</FONT><FONT COLOR="#00FF00">e</FONT><FONT COLOR="#0000FF">s</FONT><FONT COLOR="#BFD7BF">t</FONT><FONT COLOR="#9FBFEF">o</FONT><FONT COLOR="#00007F"> </FONT><FONT COLOR="#007F00">d</FONT><FONT COLOR="#7F0000">a</FONT><FONT COLOR="#000000"> </FONT><FONT COLOR="#BFBFBF">c</FONT><FONT COLOR="#FFFF00">o</FONT><FONT COLOR="#00FFFF">l</FONT><FONT COLOR="#00FFFF">o</FONT><FONT COLOR="#FF00FF">r</FONT><FONT COLOR="#9F9F9F">a</FONT><FONT COLOR="#7F007F">r</FONT><FONT COLOR="#007F7F">e</FONT><BR><FONT COLOR="#007F7F"></FONT><FONT COLOR="#7F7F00"></FONT></FONT>

[Prill]

Il tag font è certamente da evitare, obsoleto e per altro non supportato in html5

[carlomarangoni]

Il tag font è certamente da evitare, obsoleto e per altro non supportato in html5

Certamente!!! Ma è solo un esempio per far capire come fare, poi è ovvio che si deve formattare con css

[Prill]

un esempio più corretto:

#colorato {
    color: #0000FF; /* colore del testo nel paragrafo */
}
#colorato:first-letter {
    color: #CCCCCC;  /* colore della prima lettera del paragrafo */
}
.rosso {
    color: #FF0000; /* colore della lettera compresa nello specifico span, è stata utilizzata una classe perché si può riutilizzare più volte  */
}
.verde {
    color: #00FF00;
}
.giallo {
    color: #FFFF00;
}

html:

<p id="colorato">T<span class="verde">E</span><span class="rosso">S</span><span class="giallo">T</span>O</p>

questo è il modo più semplice e immediato, anche perché mi pare di capire che sia un compito assegnato presupponendo conoscenze ridotte dei css (e in questo caso anche :first-letter sarebbe di troppo)

[Aleandro23]

Abbiamo studiato pure le pseudo-classi. Con l'uso di quelle, c'è un modo per risolvere l'esercizio?

[Prill]

Con l'uso di alcune pseudo classi (:nth-child) potresti semplificare il codice evitando di richiamare un id o una classe sugli span, ma sempre e comunque le singole lettere andrebbero dentro uno span

[Aleandro23]

Non c'è un modo più semplice, tipo scrivere solo il nome senza inserirlo tra i tag?

[Mich_]

Se dovessi farlo io, mi scriverei uno script in JS che prende i caratteri uno alla volta e li inserisce in tag <span>, ed infine sostituisce la serie degli <span> dentro l'oggetto orignale. Poi darei i colori con :nth-child o sim.

Immagino pero` che nell'esercizio non sia previsto l'uso di JS per sistemarsi un oggetto di quel tipo ...