Bloccare l'ereditarietà

**Debiru** · 15-02-2007, 12:02

Ragazzi, ho questo problema, siccome devo far visualizzare all'interno del sito un codice html a sé stante, a cui non vanno applicati gli stili del contesto, mi chiedevo se era possibile bloccare l'effetto dei css in un determinato ambito, vi faccio vedere un codice di esempio:

codice:

<html>
	<head>
		<style>
			#prova p{
				font-family: "Arial Black";
				font-size: 50px;
				font-weight: bolder;
			}
		</style>
	</head>
	<body>
		<div id="prova">
			

Ciao</p>
			<div>
				

Ciao</p>
			</div>
		</div>
	</body>
</html>

Il ciao numero 2 si vede allo stesso modo del primo ciao, perché il div interno eredita dal div esterno, vorrei invece che questo div interno faccia da scudo, in maniera tale che il secondo ciao si veda normale.

E' possibile?

**Mich_** · 15-02-2007, 12:19

Attenzione che non e` come credi. Non e` una questione di ereditarieta`, ma di selettori.

#prova p
individua tutti i p interni all'elemento con id="prova".
Tu invece vorresti i p figli diretti del #prova, cioe`:
#prova>p
(che pero` non funziona in IE6)

Comunque nel tuo caso specifico puoi anche usare:

codice:

#prova p{
  font-family: "Arial Black";
  font-size: 50px;
  font-weight: bolder;
}
#prova div p {
  font-weight: normal;
}

Che non ha problemi di compatibilita` con IE.

**Debiru** · 15-02-2007, 15:14

Se nel caso volessi creare un div, esempio id="stopclass", e far sì che tutto il contenuto non sia soggetto alle classi impostate, c'è un modo per resettare i parametri di default?

Non esiste proprio un modo per dirgli che all'interno di quel div non bisogna usare le classi ridefinite?

**Mich_** · 15-02-2007, 15:53

Puoi definire dei paramentri diversi per il "div interno", anche usando eventualmente il valore auto (per gli attributi per cui e` valido), ma per "dimenticare" l'ereditarieta` devi comunque ridefinire l'attributo.

Puoi anche assegnare una classe al "div interno" e definire gli attributi per tale classe.

Comunque la cosa piu` semplice, mi sembra definire i parametri solo per l'esterno.
Riprendendo l'esempio originale, ti basta specificare una classe al

esterno:

codice:

<div id="prova">
  <p class="speciale">Ciao</p>
  <div>
    

Ciao</p>
  </div>
</div>

con il CSS:
.speciale {
  font-family: "Arial Black";
  font-size: 50px;
  font-weight: bolder;
}

**Debiru** · 15-02-2007, 16:53

Eh, non è facilissimo, ti spiego la mia situazione così forse riesci ad avere il panorma

Dunque, devo gestire un sito che ha un baccanale di css per definire anche la più piccole facezie.

In questo sito devo dare la possibilità di inserire dei messaggi in un database con la possibilità di usare html, per questo ci sono gli editor in js belli e pronti.

Fai conto che l'utente X inserisca un messaggio e lo vede in un certo modo. Fin quì tutto fa bene.

Ora, poniamo conto che all'interno del sito devo visualizzare tale messaggio, l'utene lo ha inserito in un modo e per via dei css del sito lo vede poi in un altro.

L'editor risolve perché in realtà la pagina con la textarea si trova in un iframe per cavoli suoi, ma il messaggio poi lo devo caricare sulla mia pagina... e potrebbe essere stravolto.

La mia idea era quella di caricarlo in un div neutro interno senza stili, ma da come dici devo ridefinire gli stili, non posso azzerarli

**Mich_** · 15-02-2007, 17:19

Di solito l'utente inserisce il contenuto, alla formattazione ci pensa il CMS, o comunque l'editore (azzerando la formattazione di chi ha inserito). A volte vengono permessi alcuni tag, tipo [b] [i] e pochi altri, oltre ad eventuali
.
Per un esempio puoi vedere il blog di HTML.it. In esso vedi anche immediatamente cosa succede quando scrivi nella textarea di inserimento (se non premi invio, quanto inserito non viene spedito, quindi puoi sbizzarrirti nelle prove). E prova anche a visualizzare codice HTML dopo aver inserito del testo: vedrai i tuoi tag, se tra quelli accettati.

Il div in cui c'e` il testo, va quindi opportunamente formattato, con le caratteristiche che vuole il Webmaster, non con quelle che vuole l'utente. Al limite puoi permettere qualche CSS in linea, anche se io al tuo posto lo filtrerei via (potenza delle RegExp).

Comunque in un blocco puoi definire alcune proprieta` CSS con il valore auto, che vuol dire lasciarle al default del browser.

Discussione: Bloccare l'ereditarietà

Strumenti discussione

Ricerca discussione

Visualizza

Bloccare l'ereditarietà

Permessi di invio