Restablecer CSS para una determinada área de la página?

StackOverflow https://stackoverflow.com/questions/1731555

  •  20-09-2019
  •  | 
  •  

Pregunta

Estoy trabajando en un CMS. Una de sus funciones es la edición de "fragmentos" HTML en un editor Wysiwyg que se muestran como páginas individuales.

Tengo un área en el CMS donde se observan estos trozos.

Los fragmentos se basan en un archivo "Foundation.css" que se carga en el editor WYSIWYG. Hace algunos restos pequeños, define una fuente predeterminada y un color de texto, y en general es muy simple.

El CMS, obviamente, viene con una tonelada de declaraciones de CSS, muchas de las cuales afectan la configuración general como el tamaño de la fuente, la familia, el color, la altura de la línea, los modos y similares.

Naturalmente, cuando intento mostrar un fragmento HTML en una página de CMS, se ve diferente de cuando se muestra solo con la hoja de estilo Foundation.css.

¿Alguien puede pensar en una forma de limpiar un área definida en una página HTML (por ejemplo, un div) de todas las definiciones de estilo anteriores? No puedo.

  • Un iframe que muestra el fragmento e incrustación de la base.css ayudaría, pero temo que el flujo de trabajo del usuario cuando se deben representar 5-10 iframes y luego ajustados en altura a través de JS una vez que se cargan. Yuck.

  • He pensado en "levantar" todos los demás CSS a una subclase (es decir, ajustar el CSS del CMS), pero eso implicaría tocar muchos archivos, algunos probablemente algunos código fuente de PHP, y prefiero no hacer eso.

No creo que esto tenga una solución, pero nunca se sabe.

¿Fue útil?

Solución

Puede dar una clase a todos los Divs que contienen código del editor Wysiwyg, y luego restablecer todo dentro de ese Div.

Otros consejos

Existen Restablecimiento de CSS hojas de estilo disponibles; ¿Podrías modificarlos, tal vez?

Además de lo que GSTO dijo que puede tener algo de estilo configurado como

div.clearCss *
{
  property: value !important 
}

Con todas las propiedades de estilo pertinente se restablecen. Este estilo debe aplicarse a cualquier cosa bajo un elemento con ClearCSS establecido como su clase, por lo que solo necesitaría aplicar esa clase al elemento principal.

¿Está utilizando un editor WYSIWYG específico en CMS? Descubrí que el Telerik Radeditor le permitirá usar hojas de estilo específicas para el área de edición real del editor. El editor que está utilizando también podría hacerlo.

Buena suerte y espero que esto ayude.

Si lo tomas Tinymce Por ejemplo, también usan un iframe, creo que tuvieron los mismos problemas como usted. Lo uso en mi backend y en algunas páginas 4 iframes. No veo ningún problema de rendimiento.

Con TinyMCE es posible comprimir las funciones que necesita (en PHP, JSP, .NET y ColdFusion), esto le brinda una gran cantidad de velocidad.

Piense dos veces, le bevore su propio editor Wysiwyg, los otros están bien probados y tienen una litera de muy buenos complementos para casi todas las necesidades.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top