Css e class html multiple

di il
1 risposte

Css e class html multiple

Ciao a tutti, sono nuovo del mondo css e sto scrivendo un programma che leggendo le pagine html accede ai file .css per trovare le caratteristiche della class indicate nel file .css.

Da un sito online abbiamo sui css multipli trovo:
"dichiarazione di classi multiple:
p.testorosso.grassetto {color:red; font-weight:bold;}
Questa regola applicherà gli stili impostati a tutti gli elementi in cui siano presenti (in qualunque
ordine) i nomi delle classi definiti nel selettore. Avranno dunque il testo rosso e in grassetto questi
paragrafi:
<p class="grassetto testorosso maiuscolo">..</p>
<p class="testorosso grassetto">...</p>
ma non questo, perchè solo uno dei nomi è presente come valore di class:
<p class="grassetto">...</p>""

L'esempio in grassetto qui sopra mi mette in difficoltà, io pensavo di dover cercare unicamente una stinga nel file css di questo tipo
.grassetto.testorosso.maiuscolo {....} (oppure va cercata con gli spazi ".grassetto .testorosso .maiuscolo" ?) oppure tre distinte definizioni come
.grassetto {....}
.testorosso {....}
.maiuscolo {....}

ma per rispettare quanto dice il testo per trovare una combinazione qualsiasi dei tre valori "grassetto testorosso maiuscolo" dovrei andare per tentativi:
.grassetto.testorosso.maiuscolo {....} --> e non lo troverei
.grassetto.maiuscolo {....} --> e non lo troverei
.testorosso.maiuscolo {....} --> e non lo troverei
.grassetto.testorosso {....} --> trovato
.maiuscolo {....} --> trovato

è corretto? Esistono modi migliori non andando per tentativi?

e poi vedendo dei siti ho rilevato situazioni di questo tipo:
.ciao .maiuscolo {color: red}
.promo .maiuscolo .ultimo {color: green}

quale dei due risultati è corretto applicare in questi casi?

grazie mille a tutti... e scusatemi se non ho usato i termini appropriati, ma sono un novizio di css

1 Risposte

  • Re: Css e class html multiple

    ondertol ha scritto:


    Ciao a tutti, sono nuovo del mondo css e sto scrivendo un programma che leggendo le pagine html accede ai file .css per trovare le caratteristiche della class indicate nel file .css.
    Ciao ondertol,
    Forse hai le idee un po confuse e hai bisogno di capire meglio questa argomentazione.
    Prima di tutto, da dove stai leggendo e studiando css? nel caso posso consigliarti un libro o un sito dove studiarlo al meglio

    Seconda cosa, le classi multiple, all'interno di un div, di un p o in un altro tag in html servono per concatenare gli stili in una determinata parte del DOM.
    quindi, come nel tuo esempio
    <p class="grassetto testorosso maiuscolo">..</p>
    sarà un paragrafo in grassetto, rosso e con i caratteri forzati in mauiscolo.
    ma nel css non troverai mai ".grassetto .testorosso .maiuscolo" perchè all'interno del tuo file css gli stai dicendo di prendere la classe maiuscolo che si trova dentro testorosso che si trova dentro a grassetto.

    invece troverai tre diverse sezioni del tuo codice css che fanno tre cose diverse
    .grassetto {
    font-weight: bold;
    }
    .testorosso {
    color: red;
    }
    
    .maiuscolo {
    text-transform: uppercase;
    }
    che, mettendole nello stesso tag fa il paragrafo in grassetto, rosso e con i caratteri in mauiscolo, come detto in precedenza.
Devi accedere o registrarti per scrivere nel forum
1 risposte