Quiero utilizar Twitter bootstrap para algún sitio en el que estoy trabajando. Este sitio requiere una plantilla preestablecida para usarse en ciertas partes de la página.Limitar hoja de estilo a una etiqueta y descendientes

Si incluyo la hoja de estilo de arranque de twitter, se estropea la plantilla original.

quiero incluir la hoja de estilo externa bootstrap.cc pero hacer que funcione sólo en etiquetas que son un descendiente de class = "Mi contenido"

<html> 
<link href="original stylsheet.css"> 
<link href="bootstrap.css"> 
... 
... 
<div class="header"> 
original stlesheet to be used here 
</div> 
<div class="mycontent"> 
bootstrap css to work for all descendents of my content 
</div>

Sé que una forma de hacerlo es editar el CSS y añadir. mycontent antes de cada etiqueta. Pero me preguntaba si había una solución más inteligente

Fuente

2012-08-24 Roopak Venkatakrishnan

Incluir arranque antes de que la hoja de estilo original, por lo que sus estilos tienen prioridad sobre los de arranque. – Will

que funciona en su mayor parte .... PERO falla si hay una modificación en el arranque que no está presente en mi hoja de estilo original –

CSS Scoped

Si scope atributo está presente, entonces <style> sólo se aplica a su elemento padre.

<div> 
    <style scoped> 
    /* your css here */ 
    <style> 
    <!-- content --> 
</div>

Carece de soporte de los navegadores, pero hay una polyfill: jQuery Scoped CSS plugin.

Lectura adicional: Saving the Day with Scoped CSS.

actual soporte de los navegadores: http://caniuse.com/#feat=style-scoped

Fuente

2012-09-23 15:30:41 Pavlo

¡este es el más cercano a lo que he estado buscando! Gracias –

Como puedo ver su código:

<html> 
<link rel="original stylsheet.css"> 
<link rel="bootstrap.css"> 
... 
... 
<div class="header"> 
original stlesheet to be used here 
</div> 
<div class="mycontent"> 
bootstrap css to work for all descendents of my content 
</div>

está utilizando el camino equivocado.
usted debe tratar <link href="bootstrap.css">
espero que su problema será resuelto con la ayuda

Fuente

2012-08-24 13:55:22 supersaiyan

Ok, eso fue un error tipográfico aquí ... mi pregunta sigue en pie ... quiero la hoja de estilo extrenal para afectar solo a los elementos en mycontent –

Limitar hoja de estilo a una etiqueta y descendientes

Respuesta

CSS Scoped

Cuestiones relacionadas