Twitterのブートストラップで `background：transparent！important`をオーバーライドCSS

グラフィックスとして背景色のdivを描画するアプリケーションがあります。
これらのdivは画面に表示されますが、divはPDFに印刷すると消えます。Twitterのブートストラップで `background：transparent！important`をオーバーライドCSS

問題をTwitterのブートストラップCSSにトレースしました。ブートストラップCSSが存在しない場合、divは正常に印刷されます。しかし、それがあるときには印刷しないでください。このJSFiddleを参照してください。

http://jsfiddle.net/VYg9s/

私は問題は、Twitter CSSのこのセクションだと思います。私考える私はbackground: transparent !importantを無効にする必要がありますが、私の人生のためにどのように把握することはできません。

これはおそらく単純です。試しましたbackground: opaque !importantしかし、それは動作しませんでした、私はbackgroundプロパティの許容値のリストを見つけることができないようです。

@media print { 
    * { 
    color: #000 !important; 
    text-shadow: none !important; 
    background: transparent !important; 
    box-shadow: none !important; 
    }

CSSのbackground: transparent !important;の反対は何ですか？

出典

2013-12-12 prototype

background: transparent !important;の反対側には、「色進コード」は、任意のCSSに許容されるカラーコードのタイプとすることができるbackground: color hex code !important;

あります。など、RGB、RGBA、16進数、同様にこの手つかずbootstrap.cssを保つために

出典

2013-12-12 03:39:49 DrCord

なぜこれが-1に値するだろう、これは正しいと私はトラブルモバイルでそれをフォーマットしていたが、それは今も元気..です – DrCord

（-1 WA私はOPではありません。）ありがとう、これは動作します！ *しかし、実際のアプリには、Bootstrapの透過指示の結果として消える異なる色の異なるdivがたくさんあります。私が努力することができるのは、それぞれのために色を戻すことです。 TwitterのCSSは透明性を世界的に追加しました。グローバルに不透明に設定する方法がありますか？ – prototype

@ user645715ブートストラップを実行したくない場合は、bootstrap.cssファイルから削除するだけです。 – Ming

-1

はヘッドの下部にjqueryのと注入メディア印刷用CSSによって「上書きCSSのスラム」を獲得する方法です。 ...

<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>CssTest</title> <link href="/libs/dev/bootstrap/bootstrap.min.css" rel="stylesheet" /> <script src="/libs/dev/common.js"></script> </head> <body> <button>Test Change/Add Dynamic</button><br /> <br /> <div id="test1" style="background-color: red; display: block; width: 500px; height: 100px"> HELLO </div> <div id="test2" style="background-color: green; display: block; width: 500px; height: 100px"> HELLO </div> <div id="test3" style="background-color: orange; display: block; width: 500px; height: 100px"> HELLO </div> <script> var app = {}; app.updatePrintCSS = function (items) { $("[data-role='printAdded']").remove(); $(items).each(function (i, e) { var data = "@@media print{#" + $(e).attr("id") + "{ background-color: " + $(e).css("background-color") + " !important; }}"; $("<style data-role='printAdded'></style>").appendTo("head").html(data); }); } $(function() { app.updatePrintCSS($("div")); $("button").on("click", function (e) { $("#test3").css("background-color", "#FF69B4 !important"); $("body").append($('<div id="test4" style="background-color: blue; display: block; width: 500px; height: 100px" >HELLO</div>')); app.updatePrintCSS($('div')); }); }); </script> </body> </html>

出典

2015-05-04 12:48:47 iqmeta

Twitterのブートストラップで `background：transparent！important`をオーバーライドCSS

答えて

関連する問題