Domanda

Questa riga in YUI Reimposta CSS mi sta causando problemi:

address,caption,cite,code,dfn,em,strong,th,var {
    font-style: normal;
    font-weight: normal;
}

Fa mio em non corsivo e mio strong non audace.Il che va bene.So come sovrascriverlo nel mio foglio di stile.

strong, b 
{
  font-weight: bold;
}

em, i 
{
  font-style: italic;
}

Il problema sorge quando ho del testo che è entrambe le cose em E strong.

<strong>This is bold, <em>and this is italic, but not bold</em></strong>

La mia regola per strong lo rende audace, ma la regola di YUI per em lo rende di nuovo normale.Come posso risolverlo?

È stato utile?

Soluzione

Se la tua dichiarazione forte viene dopo quella di YUI, la tua dovrebbe sovrascriverla.Puoi forzarlo in questo modo:

strong, b, strong *, b * { font-weight: bold; }
em, i, em *, i * { font-style: italic; }

Se supporti ancora IE7 dovrai aggiungere !important.

strong, b, strong *, b * { font-weight: bold !important; }
em, i, em *, i * { font-style: italic !important; }

Funziona: verifica tu stesso:

/*YUI styles*/
address,caption,cite,code,dfn,em,strong,th,var {
  font-style: normal;
  font-weight: normal;
}
/*End YUI styles =*/

strong, b, strong *, b * {
  font-weight: bold;
}

em, i, em *, i * {
  font-style: italic;
}
 <strong>Bold</strong> - <em>Italic</em> - <strong>Bold and <em>Italic</em></strong>

Altri suggerimenti

Vorrei utilizzare questa regola per sovrascrivere il ripristino YUI:

strong, b, strong *, b *
{
  font-weight: bold;
}

em, i, em *, i *
{
  font-style: italic;
}

Se oltre a utilizzare YUI reset.css, utilizzi anche YUI base.css, sarai impostato con un set standard di stili di base per tutti i browser.

COLLEGAMENTO: http://developer.yahoo.com/yui/base/

Ho riscontrato un problema simile quando ho aggiunto YUI Reset all'inizio del mio file CSS di serie.Ho scoperto che la cosa migliore per me era semplicemente rimuovere tutto il file

font-weight: normal;

dichiarazioni dallo YUI Reset.Non ho notato che questo abbia influenzato qualcosa di "cross-browser".

Tutte le mie dichiarazioni sono state successive al ripristino YUI, quindi non sono sicuro del motivo per cui non hanno avuto effetto.

Finché i tuoi stili vengono caricati dopo quelli ripristinati, dovrebbero funzionare.Che browser è questo?poiché anch'io lavoro in modo simile e non ho riscontrato questo problema, mi chiedo se sia colpa di qualcosa nei miei test.

È meglio utilizzare i fogli di stile di ripristino come base.Se non vuoi reimpostarli o strong, rimuovili dal foglio di stile.

Come ha detto Chris, non è necessario utilizzare l'esatto CSS fornito religiosamente.Vorrei semplicemente salvare una copia sul tuo server e modificarla in base alle tue esigenze.

Suggerirei di evitare qualsiasi cosa che implichi l'hacking dei file YUI.Devi essere in grado di aggiornare le librerie esterne in futuro e se il tuo sito si basa su versioni modificate ci sono buone probabilità che venga potenziato.Penso che questa sia una buona pratica generale per qualsiasi libreria di terze parti che usi.

Così ho pensato Questo la risposta era tra le migliori

Se oltre a utilizzare YUI reset.css, utilizzi anche YUI base.css, sarai impostato con un set standard di stili di base per tutti i browser.

Capisco quello che stai dicendo.Immagino che tu possa aggiungere una regola CSS come questa:

strong em { font-weight: bold; }

O:

strong * { font-weight: bold; }

Pensavo di avere una soluzione ideale:

strong, b 
{
  font-weight: bold;
  font-style: inherit;
}

em, i 
{
  font-style: italic;
  font-weight: inherit;
}

Sfortunatamente, Internet Explorer non supporta "eredità". :-(

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top