ホームページ  >  記事  >  ウェブフロントエンド  >  Bootstrap 3 のボックス サイズ変更スタイルにより、UEditor コントロールの画像が正常に拡大縮小されません。

Bootstrap 3 のボックス サイズ変更スタイルにより、UEditor コントロールの画像が正常に拡大縮小されません。

WBOY
WBOYオリジナル
2016-09-12 17:27:121281ブラウズ

UEditor コンポーネントは、Baidu が提供するオープンソースの Web オンライン WYSIWYG リッチ テキスト エディターのセットで、軽量でカスタマイズ可能で、MIT プロトコルに基づいており、非常に強力な機能を備えています。最近、アップロードした写真(または既存の絵文字写真に挿入した写真)が正常に拡大縮小できないことがわかりました。画像を選択し、画像の端にある小さなラベルをマウスでクリックしてドラッグすると、画像は縮小することはできますが、縮小することはできません。拡大した。色々な方法を試しましたが解決できず、jsソースコードを確認しても異常は見つかりませんでした。

その後、ページに Bootstrap が導入されていることを偶然発見しました。Bootstrap は、デフォルトで box-sizing スタイルを border-box に統一しました。特定のコンテンツについては、Bootstrap のリリース ログを確認してください: http://blog.getbootstrap.com/2013/08/19/bootstrap-3-release/

ボックス サイズ設定スタイルの定義と使用法については、こちらを参照してください: http://www.w3school.com.cn/cssref/pr_box-sizing.asp

Bootstrap に影響を与える CSS:

リーリー

以下のように、ページ上の CSS を再定義して、Bootstrap で上記のスタイルをオーバーライドするだけで済みます。

リーリー

* .edui-container は、UEditor コンポーネントを参照する親要素で使用される CSS クラスです。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。