Bootstrap 3的box-sizing样式导致UEditor控件的图片无法正常缩放的解决方案

UEditor est un ensemble de composants de texte riche en ligne, open source fourni par Baidu, qui est léger, personnalisable, axé sur l'expérience utilisateur et basé sur le protocole MIT, avec des fonctionnalités très puissantes. Récemment, j'ai découvert que les images téléchargées (ou les images d'émoticônes existantes insérées) ne peuvent pas être redimensionnées normalement. En sélectionnant l'image, en cliquant et en glissant les petites étiquettes à la marge de l'image avec la souris, l'image ne peut que se réduire et ne pas se dilater. J'ai essayé de nombreuses méthodes pour résoudre ce problème, même en vérifiant le code source js, mais je n'ai pas trouvé d'endroit anormal.

　　Plus tard, j'ai découvert par hasard que la page incluait Bootstrap, et Bootstrap par défaut a mis box-Le style sizing est uniformément réglé en border-box. Le contenu détaillé peut être consulté dans les journaux de publication de Bootstrap :http://blog.getbootstrap.com/2013/08/19/bootstrap-3-released/

　　À propos de box-La définition et l'utilisation du style sizing peuvent être vus ici :http://www.w3school.com.cn/cssref/pr_box-sizing.asp

　　Les css affectés dans Bootstrap :

*,
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

　　Nous devons simplement redéfinir le css sur la page pour couvrir les styles mentionnés ci-dessus dans Bootstrap, par exemple :

.edui-container *{
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.edui-container *:before,
.edui-container *:after {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}

　　* .edui-La classe CSS container est utilisée comme élément parent de l'UEditor.

Ce que j'ai présenté ici est Bootstrap que j'ai présenté à tout le monde 3的box-Toute la narration sur la solution complète du problème de l'image du composant UEditor qui ne peut pas être redimensionnée normalement en raison du style de sizing, j'espère que cela pourra aider certains d'entre vous. Si vous avez des questions, n'hésitez pas à me laisser un message, je répondrai à temps à vos questions !