Je suis simplement en train d'écrire une boîte de dialogue UI JavaScript pour une application Web. Le problème est que les utilisateurs peuvent créer des thèmes propres à l'application Web, qui peuvent inclure les sélecteurs de l'élément CSS ( Par exemple, le thème de l'utilisateur comprend: P> H1 {...}, div {...} code> etc.) qui écrase ma mise en forme de CSS pour la boîte de dialogue UI. La boîte de dialogue est un élément divisé en formaille sur un sélecteur de classe (Dose d'identification ne fonctionne pas car cette boîte de dialogue peut apparaître plusieurs fois). Existe-t-il un moyen d'arrêter le sélecteur d'éléments du style de modèle d'utilisateur affectant la boîte de dialogue UI, sans avoir à utiliser un style de réinitialisation CSS énorme et à l'aide de ! Important code> pour chaque style de la boîte de dialogue UI? Comment les bibliothèques d'interface utilisateur comme la boîte de dialogue de la boîte de dialogue d'UI de JQuery UI? <div class="ui_modal_wrap>
<input type="text" name="#" />
</div>
3 Réponses :
En général, vous devez savoir que les règles sont appliquées (si elles sont toutes deux dans des feuilles de style externes) avec des règles de spécificité .
Généralement, il y a un score que vous pouvez penser et la règle s'appliquant à la L'élément qui a le score le plus élevé sera appliqué.
dans une chaîne de sélection, chaque type d'élément en vaut une, les classes valent 10 et une carte d'identité vaut 100 points.
< Code> Corps Div.Wrapper == 12 points
Il suffit généralement de faire les règles spécifiques à la page (qui stysez le reste de votre page) moins spécifique et laissez l'UI CSS prendre la relève. Alternativement, vous pouvez toujours mettre le marquage d'interface utilisateur à l'intérieur d'un "super" de bit de HTML, comme: puis "espace de noms" le CSS pour l'interface utilisateur en mettant Corps Div.Wrapper div Span == 14 points Quote == 101 Points # Super # super2 avant chaque règle sur cette feuille de style.
Il n'y a aucun moyen de m'assurer que cela sauf si:
lire Spécificité CSS
Ceci est vrai, vous ne pouvez pas vous garantir que votre style est utilisé, uniquement si vous pouvez vous assurer que ces deux choses ... IMPORTANT de savoir, si grâce à la bonne spécificité CSS peut écraser la plupart des styles!
Vous devrez avoir un deuxième ensemble de styles qui utilisent des sélecteurs plus spécifiques, qui remplacera les éléments définis par les styles de l'utilisateur. En utilisant HTML P> ! Important code> n'est qu'un moyen de le faire. Rechercher Spécificité CSS Strong> Pour plus d'informations. div.ui-dialog h1 {
color: red;
}
Hey Tims, c'est juste la méthode que j'utilise ATM, mais elle ne fonctionne pas si l'utilisateur applique un style que vous n'avez pas utilisé dans l'UI CSS, par exemple. avec votre exemple si l'utilisateur a appliqué un style H1 {style texte: italique} mais vous ne voulez pas que le texte soit en italique dans la boîte de dialogue UI, vous avez donc encore besoin d'une énorme réinitialisation CSS (et celle que j'ai faite encore dose pas tout couvrir ...
Oui, j'ai un problème très similaire pour vous pour le moment. Il suffit de réinitialiser autant de paramètres par défaut que vous pouvez dans votre portée spécifique. Je serais intéressé d'entendre plus de solutions que vous pouvez trouver!
Veuillez indiquer un code CSS, notamment la définition de votre boîte de dialogue pour le moment.
Pourriez-vous ne pas limiter les sélecteurs qu'ils peuvent changer ?? Par exemple, leur permettant de changer de couleur ou de style de police ?? Si vous leur permettez d'ouvrir tous les CSS, qu'est-ce que les empêcher de blesser tout votre balisage ?? Ce qui permettra d'essayer de contrôler certaines parties de votre UI inutiles, car ils ont donné la position absolue de latitude et la déplaçante de 30000px à gauche.
L'interface utilisateur fait partie de la CMS d'utilisation personnalisée qui permet des modèles d'utilisateur, mais l'interface utilisateur avant doit ressembler de la même manière, même si le concepteur de modèle décide de faire tout son style avec des sélecteurs d'éléments.