Due classi CSS per body

**Federix** · 30-10-2003, 17:17

Avrei bisogno di due classi differenti per il tag body, una così:

codice:

body {
  background-color: #666666;
}

e l'altro così:

codice:

body {
  background-color: #FFFFFF;
}

Il secondo stile mi serve unicamente per una pagina. Come posso fare????

**Saturno83** · 30-10-2003, 17:24

per il secodo usa una classe
ad es:

#sfondo {background-color: #FFFFFF;}

poi quando ti serve:

<body id="sfondo" ....

**Federix** · 30-10-2003, 17:27

Perfettooooooooooooooooooooooooooooooooooooooooo

**gordian** · 30-10-2003, 18:58

Originariamente inviato da Saturno83
per il secodo usa una classe
ad es:

#sfondo {background-color: #FFFFFF;}

poi quando ti serve:

<body id="sfondo" ....

Avrei una curiosità:

Normalmente ottengo lo stesso risultato scrivendo
.sfondo {background-color: #FFFFFF;}
<body class="sfondo" ....

Mentre tu hai usato un css di livello 2 che io, normalmente, applico con un'altra sintassi
#sfondo {background-color: #FFFFFF;}
<div id="sfondo" ....

Diciamo che normalmente utilizzo div per attribuire tanti altri elementi di formattazione tipo padding font margin ecc.. non solo lo sfondo.
Comunque non è questo il punto.
Volevo capire una volta per tutte quando si raccomanda di usare una sintassi e quando ne raccomandano un'altra.

Ho notato che scrivendo
#aspetto {...
<div id="aspetto" ....
il w3c non mi valida la pagina, mentre usando la classe tipica del css di livello 1, la valida perfettamente.

Anche se in output i risultati sono identici vorrei capire gli standard. :master:
Grazie.

**Saturno83** · 30-10-2003, 21:23

la differenza è che se usi
#sfondo
quella classe la puoi usare una sola volta nel documento altrimenti il validatore ti da errore
Se usi .sfondo la puoi richiamare quante volte vuoi

La differenza è tutta qui da che ne so io

Gli attributi che usi o il dove lo posizioni non c'entrano...

**antos** · 30-10-2003, 22:46

Originariamente inviato da Saturno83
la differenza è che se usi
#sfondo
quella classe la puoi usare una sola volta nel documento altrimenti il validatore ti da errore
Se usi .sfondo la puoi richiamare quante volte vuoi

La differenza è tutta qui da che ne so io

Gli attributi che usi o il dove lo posizioni non c'entrano...

la differenza è appunto che con il selettore #sfondo specifichi univocamente un elemento della pagina tramite il suo identificatore (id, cioè sfondo), quindi in una pagina ci può essere un solo elemento che si chiami sfondo .
con le classi .nomeclasse si può attribuire lo stile definito a + elementi della stessa pagina
se però attribuisci id uguali a + elementi in una pagina i browser o non protestano o danno strano risultato in output quindi meglio rispettare la regola

**Saturno83** · 31-10-2003, 10:09

Originariamente inviato da antos
la differenza è appunto che con il selettore #sfondo specifichi univocamente un elemento della pagina tramite il suo identificatore (id, cioè sfondo), quindi in una pagina ci può essere un solo elemento che si chiami sfondo .
con le classi .nomeclasse si può attribuire lo stile definito a + elementi della stessa pagina
se però attribuisci id uguali a + elementi in una pagina i browser o non protestano o danno strano risultato in output quindi meglio rispettare la regola

E io che ho detto

**gordian** · 31-10-2003, 15:39

Scusate ma....
Ho letto decine di tutorial che non fanno che ripetere che le tabelle dovrebbero essere abbandonate a favore dei css2.
Il principio sarebbe quello di definire tanti "box" al posto dei classici <td>.
Seguendo il vostro ragionamento (correttissimo dal punto di vista del w3c), nel caso in cui io debba simulare n <td> tutti uguali con altrettanti box, non potrei scrivere <div id.. per tutti, ma bensì tanti <span class...

Giusto?

Mi viene allora da chiedermi:
Come faccio ad attribuire altre classi all'interno di una delle aree definita da una classe???

Questo esempio vi farà capire meglio:

Codice PHP:


<html>

<head>

<title>Untitled Document</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">

<!--

.prova {  background-color: #00CC66; 

text-align: left; 

padding-top: 5px; 

padding-right: 5px; 

padding-bottom: 5px; 

padding-left: 5px; 

border: 1px #000000 dashed; 

width: 150px; 

margin-top: 5px}

#box {  text-align: center; 

width: 200px; 

border: #000000; 

border-style: solid; 

border-top-width: 2px; 

border-right-width: 2px; 

border-bottom-width: 2px; 

border-left-width: 2px; 

padding-bottom: 5px}

-->

</style>

</head>



<body>

<div id="box">

    <span class="prova">testo</span>

    <span class="prova">testo</span>

    <span class="prova">testo</span>

    <span class="prova">testo</span>

</div>

</body>

</html>

Immaginate di voler attribuire con una classe il colore rosso a 2 dei 4 testi :master:

Magari è una cavolata, ma al momento non mi viene...

**Saturno83** · 31-10-2003, 16:38

crei due classi diverse...

codice:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.prova {  background-color: #00CC66; 
text-align: left; 
padding-top: 5px; 
padding-right: 5px; 
padding-bottom: 5px; 
padding-left: 5px; 
border: 1px #000000 dashed; 
width: 150px; 
margin-top: 5px}
.provaRosso {  background-color: #00CC66; 
text-align: left; 
padding-top: 5px; 
padding-right: 5px; 
padding-bottom: 5px; 
padding-left: 5px; 
border: 1px #000000 dashed; 
width: 150px; 
margin-top: 5px
COLOR: #FF0000;}
#box {  text-align: center; 
width: 200px; 
border: #000000; 
border-style: solid; 
border-top-width: 2px; 
border-right-width: 2px; 
border-bottom-width: 2px; 
border-left-width: 2px; 
padding-bottom: 5px}
-->
</style>
</head>

<body>
<div id="box">
    <span class="provaRosso">testo</span>
    <span class="provaRosso">testo</span>
    <span class="prova">testo</span>
    <span class="prova">testo</span>
</div>
</body>
</html>

Comunque mi sai che fai un po' di confusione fra div/span e id/class
Non è che devi associare un class per forza ad uno span e un id ad un div... potrebbe benissimo esserci un <div class="..."> o uno <span id="..."> come anche un <p class o <p id...

Class e ID richiamano uno stile e devono essere attribuiti ad un tag ma si usano indistintamente da esso.

**gordian** · 31-10-2003, 16:54

Originariamente inviato da Saturno83
crei due classi diverse...

codice:

<div id="box">
    <span class="provaRosso">testo</span>
    <span class="provaRosso">testo</span>
    <span class="prova">testo</span>
    <span class="prova">testo</span>
</div>

Comunque mi sai che fai un po' di confusione fra div/span e id/class
Non è che devi associare un class per forza ad uno span e un id ad un div... potrebbe benissimo esserci un <div class="..."> o uno <span id="..."> come anche un <p class o <p id...

Class e ID richiamano uno stile e devono essere attribuiti ad un tag ma si usano indistintamente da esso.

No un momento. Quello che dici tu riguardo all'intersambiabilità è giusto. Ma la mia domanda non era riferita esclusivamente a un box di una sola parola.
Immagina di dover veramente inserire una classe dentro a uno di quei <span class.
Nell'esempio di prima immagina una cosa come:

<div id="box">
<span class="prova">testo testo testo testo </span>
<span class="prova">testo testo testo testo </span>
<span class="prova">testo testo testo testo </span>
<span class="prova">testo testo testo testo </span>
</div>

nella quale tu vuoi rendere rossa una parola a caso delle 4 in ciascuna riga..

Discussione: Due classi CSS per body

Strumenti discussione

Ricerca discussione

Visualizza

Due classi CSS per body

Permessi di invio