comment faire pour effacer tous les styles css

Je suis de la création d'un extrait de code HTML pour permettre à d'autres d'ajouter des fonctionnalités à leurs sites web (c'est un vote widget). J'ai créé un extrait de code HTML comme ceci:

<div>
   [implementation of my voting widget]
</div>

J'ai passé beaucoup de temps pour obtenir la mise en forme de ce widget juste à droite. Il fonctionne très bien dans un exemple de page web qui n'a pas importer une feuille de style.

Quand j'ai ajouter un widget sur une page sur un site Drupal, toutefois, l'importation CSS, fait des ravages avec mon attention à la mise en forme. J'aimerais que mon extrait de code HTML pour ignorer toutes les feuilles de style CSS. Est-ce possible?

Indépendamment de savoir s'il est possible, est-il une meilleure solution?

Comment êtes-vous mise en forme de votre widget actuellement sans CSS?
Pitts: Il est. Il ne veut tout simplement pas le style CSS de la page pour avoir hérité par son widget.
avec du CSS

OriginalL'auteur Jeff O'Neill | 2011-03-28

  1. 8

    Au lieu de compter sur vos styles CSS ne pas être écrasés par une les feuilles de style importées, vous devriez donner à votre widget un id unique et assurez-vous que tous vos styles sont un dérivé de l'identifiant de prise de assurez-vous de mettre en œuvre les styles que vous ne voulez pas être surchargée (margin, padding, etc):

    <div id="votify">
   [implementation of my voting widget]
</div>

#votify {}
#votify ul {}
#votify div span {}
/* etc */
    yep, c'est comme jQuery UI est-il (bien qu'ils utilisent une classe spécifique structure de nommage)
    il veut que la deuxième partie de l'utilisateur pour être en mesure de déposer dans son widget, avec style en ligne, sans avoir à jouer avec leurs feuilles de style. Donc il veut en quelque sorte effacer tous les non-autochtones de style pour tout l'intérieur d'un div.

    OriginalL'auteur mVChr

  2. 4

    Vous pouvez essayer d'utiliser un reset de la feuille de style:

    http://meyerweb.com/eric/tools/css/reset/

    Bien sûr, vous ne voulez pas écraser la page du CSS, mais vous pouvez vous faire une idée sur la façon de réinitialiser les styles de votre widget utilise et utiliser vos CSS. Donc, quelque chose comme...

    #voting-widget * {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

    J'espère que cette aide.

    Mon widget ne peut pas interférer avec la mise en page existante, donc je ne pense pas que je peux importer une feuille de style. Faire inline serait très laid.
    Je ne vous suggère pas d'importer une feuille de style... je suggère que vous utilisez les idées présentées dans cet article sur la réinitialisation de styles de sorte que vous pouvez faire clair pour votre widget.
    vous devez le faire inline...

    OriginalL'auteur Hristo

  3. 1

    Réinitialiser votre widget CSS pour les valeurs par défaut, PUIS ajouter votre code de mise en forme. Ceci va effacer tous les styles de page de sorte que vous pouvez travailler à partir d'une table rase.

    div#widget, div#widget * {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  /* ... whatever other reset code ... */

  /* ... then add your own code ... */
  color: red;
}

    OriginalL'auteur James Skidmore

  4. 1

    Sans l'aide d'une feuille de style, je pense que vous devez définir explicitement toutes les marges, le rembourrage, les polices, etc dans l'attribut style de sorte qu'il prend la priorité sur toutes les CSS les feuilles qu'il y a des.

    OriginalL'auteur Andrew Cooper