Mise en forme d'éléments à l'intérieur d'un élément div sans effet de css hérité

Question

Je montre une popup comme un div fixe dans des sites Web aléatoires.

J'ai besoin que le contenu de la div ne soit pas affecté par le formatage de la page dans laquelle elle réside. Les éléments à l'intérieur du div ont CSS intégré, et je veux que le CSS en ligne soit efficace.

Une façon de faire est d'utiliser iframe. Je cherche d'autres moyens.

Options Je songe à me:

1. Un petit code javascript qui fonctionnera sur tous les éléments et réinitialiser hérité css. Est-ce possible? Puis-je dire à cross-browser qu'un attribut n'est pas créé par css en ligne?

2. code Javascript pour réinitialiser un groupe d'attributs à tous les éléments à l'intérieur d'un div (par exemple le rembourrage, les marges, etc., mais toujours laisser les attributs du style de CSS en ligne?

toute autre idée créative sur comment le faire?

Answer 1

les éléments à l'intérieur du div a en ligne CSS, et je veux seulement le CSS en ligne à soit efficace, pas hérité CSS

Ceci est le comportement par défaut. Inline CSS a la plus haute priorité. AFAIK vous ne serez pas en mesure de supprimer les styles hérités à moins que vous ne les écrasiez.

Answer 2

Une autre option (même si elle dépend de votre site) est d'avoir une classe appelée "resetCSS" ou quelque chose comme ça qui peut être appliqué à une classe. Vous utilisez cette classe dans un sélecteur et ici vous pouvez définir les valeurs de base pour tous les attributs que vous utilisez (par exemple, les marges, les polices, etc.).

Ensuite, en cours d'utilisation, vous appliquez cette classe à un élément et réinitialisez everythign aux valeurs par défaut que vous pouvez ensuite remplacer avec votre CSS.

L'autre alternative est de changer tous vos CSS actuels pour avoir une classe "style stylé" dans le sélecteur de sorte que seul le contenu qui est marqué spécifiquement recevra le style de sorte qu'il n'y a aucune chance d'être appliqué à la éléments que vous ne voulez pas l'avoir. Probablement cependant si vous voulez qu'un div ait un style particulier, même s'il s'agit de la valeur par défaut, il est préférable de lui donner ce style explicitement. S'il utilisait la valeur par défaut de toute façon, vous ne perdez rien, s'il héritait d'autre chose, alors vous le réglez à ce que vous voulez. S'appuyer sur les styles par défaut peut vous mordre parce qu'il n'y a aucune raison que deux navigateurs aient les mêmes styles par défaut.