0

作業中のサイトに CLeditor をセットアップしました。現在、エディター内で入力して編集すると、そのすぐ上に結果のライブプレビューが表示されるように設定しています。これは、StackOverflow の質問を入力するときに得られるものとよく似ていますが、より基本的です。

iframe コンテンツの内部 HTML をページの別の場所にコピーするだけで機能します。しかし、私は厄介な問題に遭遇しました。配置ボタン (左、中央、右) を使用すると、align="right"たとえば、選択したテキストに属性が追加されます。エディターでは機能しますが、ページ自体では機能しません。おそらく、その属性はほとんど廃止されているためです。

...

この質問を入力しているときに、この問題を回避する方法を実際に見つけました。それでも、この質問を私の解決策とともに投稿します。さらに、これに追加する関連する質問があります。

もともと、次の CSS をページに適用しようとしました。

div[align="right"] {
    text-align:right!important;
    }

これは最初にデータをページにロードするために機能しましたが、エディターで配置を動的に変更している間、ライブ プレビューは変更を反映していませんでした。これは、スタイルがロード時にのみ適用されるためだと最初は思いました。

私はそれよりもよく知っているので、それは脳のおならでした。本当の問題は、DIV 要素を選択していて、align 属性が必ずしも DIV に適用されていないことでした。に変更div[align="right"]すると*[align="right"]完全に機能します。

ただし、この特定の問題の回避策を見つけたにもかかわらず、cleditor が iframe の HTML 出力をどのように構築するのか、まだわかりません。属性はコードのどこalignから来て、どのようにしてそれ (および他のすべての要素/属性) を HTML に配置することを知っていますか? alignこれを操作する方法があれば、非推奨のHTML 属性ではなくインライン CSS を配置に使用するように単純に指示できます。cleditor の組み込みの「useCSS」機能を有効にしたくないことに注意してください。

共有できる情報に感謝します。最初の問題をすでに解決したという理由だけで、この質問に反対票を投じないでください。他の人が同じ問題に遭遇した場合、これが他の人を助けることができるようにしたい. (回答として回答も投稿します)。

4

1 に答える 1

0

次の CSS をページのライブ プレビューに適用すると、完全に機能します。

*[align="right"] {
  text-align:right!important;
}

左と中央も同様に行うことを忘れないでください。

于 2012-05-31T21:44:45.923 に答える