Come ignorare lo stile genitore css

Mi chiedo come ignorare uno stile genitore e utilizzare lo stile predefinito (nessuno). Mostrerò il mio caso specifico come esempio, ma sono abbastanza sicuro che questa è una domanda generale.Come ignorare lo stile genitore css

<style> 
#elementId select { 
    height:1em; 
} 
</style> 

<div id="elementId"> 
    <select name="funTimes" style="" size="5"> 
     <option value="test1">fish</option> 
     <option value="test2">eat</option> 
     <option value="test3">cows</option> 
    </select> 
</div>

modi che non vogliono risolvere questo problema:

non riesco a modificare il foglio di stile in cui la "#elementId" è impostato, il mio modulo non avrà accesso che.
Preferibilmente non eseguire l'override dello stile altezza utilizzando l'attributo style.

Ad esempio utilizzando firebug posso disattivare lo stile genitore e tutto va bene, questo è l'effetto che sto cercando.

Una volta impostato uno stile, può essere disattivato o deve essere ignorato?

fonte

2009-06-03 SeanDowney

Deve essere ignorato. È possibile utilizzare:

<!-- Add a class name to override --> 
<select name="funTimes" class="funTimes" size="5"> 

#elementId select.funTimes { 
    /* Override styles here */ 
}

è possibile utilizzare un selettore di attributo, ma dal momento che non è supportato dai browser legacy (leggi IE6, ecc), è meglio aggiungere un nome di classe

fonte

2009-06-03 19:26:31 PatrikAkerstrand

è possibile creare un'altra definizione più in basso nel foglio di stile CSS che in pratica inverte la regola iniziale. potresti anche aggiungere "! important" a detta regola per assicurarti che rimanga incollata.

fonte

2009-06-03 19:33:20 Jason

Avrebbe senso per i CSS per avere un modo per aggiungere semplicemente uno stile aggiuntivo (nella sezione head della pagina, ad esempio, che l'override del foglio di stile collegato) come questa:

<head> 
<style> 
#elementId select { 
    /* turn all styles off (no way to do this) */ 
} 
</style> 
</head>

e disattiva tutti gli stili applicati in precedenza, ma non c'è modo di farlo. Dovrai sovrascrivere l'attributo height e impostarlo su un nuovo valore nella sezione head delle tue pagine.

<head> 
<style> 
#elementId select { 
    height:1.5em; 
} 
</style> 
</head>

fonte

2009-06-04 20:34:52

Si potrebbe spegnerlo sovrascrivendo in questo modo:

altezza: auto importante;

fonte

2010-05-03 21:19:48

Semplice, sorvegliato da solo ma molto efficace. Grazie +1. – Ben

Vorrei sconsigliare l'uso di '! Important' nella marcatura di produzione - dovrebbe essere usato solo durante il debug. – Amicable

@Amicable puoi spiegare perché questo non è consigliabile? –

Ho avuto una situazione simile mentre lavoravo su un sito Web di joomla.

Aggiunto un nome classe al modulo interessato. Nel tuo caso:

<select name="funTimes" class="classname">

poi fatto la seguente modifica singola linea nel CSS. Aggiunta linea

#elementId div.classname {style to be applied !important;}

ha funzionato bene!

fonte

2012-02-24 20:11:34 Rajatgsr

se ho capito la qeustion correttamente: è possibile utilizzare "auto" nel css come questo width:auto e poi tornerà alle impostazioni predefinite

fonte

2013-01-20 13:27:09

È necessario utilizzare questo

height: auto!importante;

fonte

2015-05-27 07:57:53

Come ignorare lo stile genitore css

risposta

Problemi correlati