1

TinyMCEエディタをビジュアル エディタとして使用する CMS を使用しています。その CSS は奇妙に編集されているため、UL リストには箇条書きが表示されず、段落間にスペースがありません。

アクセスできないサーバー上の特定の CSS ファイルで定義されている外観を変更する簡単で便利な方法はありますか? でこれらの属性をオーバーライドする必要がありますwww.site.com/global.css。

ul { list-style-type: square; }
p { margin: 10 px; }

Greasemonkey で簡単にできる方法があると思いますが、スクリプトは苦手です。ああ、私は Google Chrome を使用しています。

4

3 に答える 3

3

TinyMCE を使用しているため、CSS ファイルをメイン ページではなく TinyMCE iframes ヘッドにロードする必要があります。

これにはcontent_css設定を使用します。TinyMCE のデフォルト CSS を上書きする方法です。

更新: サーバー ファイルや TinyMCE 構成にアクセスしなくても、TinyMCE API にアクセスできます。このオプションを見て、必要な場所にCSS をロードしてください。アクセスできるインターネット/イントラネット上のどこかに CSS ファイルを配置する必要があります。

// Loads a CSS file dynamically into the current document
tinymce.DOM.loadCSS('somepath/some.css');

// Loads a CSS file into the currently active editor instance
tinyMCE.activeEditor.dom.loadCSS('somepath/some.css');

// Loads a CSS file into an editor instance by id
tinyMCE.get('someid').dom.loadCSS('somepath/some.css');

// Loads multiple CSS files into the current document
tinymce.DOM.loadCSS('somepath/some.css,somepath/someother.css');

Update2 : CSS 文字列を iframe ヘッドにロードすることが可能です。これには、次のuserscriptのようなものを使用します。

// ==UserScript==
// @name    YOUR_SCRIPT_NAME
// @match   http://YOUR_SERVER.COM/YOUR_PATH/*
// ==/UserScript==

var css_to_add = 'p { margin: 10 px; }'; // example
var iframe_id = 'your_editor_id' + '_ifr'; // place your editor id here+'_ifr'
with(document.getElementById(iframe_id).contentWindow) {
    var h = document.getElementsByTagName("head");
    if (!h.length) return;
    var newStyleSheet = document.createElement("style");
    newStyleSheet.type = "text/css";
    h[0].appendChild (newStyleSheet);
    try {
        if ( typeof newStyleSheet.styleSheet !== "undefined" ) {
            newStyleSheet.styleSheet.cssText = css_to_add;
        }
        else {
            newStyleSheet.appendChild( document.createTextNode ( css_to_add ) );
            newStyleSheet.innerHTML = css_to_add;
        }
    }
    catch(e){}
}


コードを名前を付けて保存し、これらの手順に従ってMyCSSFix.user.jsChrome にインストールします (指定された場所を詳細に編集した後)。

于 2013-01-18T09:53:39.270 に答える
0

タグ インラインに追加された属性は、以前に読み込まれたスタイルシート宣言をオーバーライドする必要があります。

<p style="margin:0px;"></p>

global.css の p-margin スタイルをオーバーライドする必要があります

于 2013-01-18T09:40:25.490 に答える
0

css ファイルで!importantを使用します

ul { list-style-type: square !important; }
于 2013-01-18T09:41:17.730 に答える