できるだけ多くのフォーム要素のスタイリングを含むjQueryテーマに取り組んでいます。 最初はWebkit(Chrome)用に開発されました。今私はそれもFirefoxで動作するようにしたい。FirefoxでWebkit固有のCSSセレクタを無視する
問題があります。 FirefoxにはWebkit固有の構文に問題があります。例えば
:
input[type="range"]::-webkit-slider-thumb,
input[type=radio],
input[type=checkbox] {
-webkit-appearance: none !important;
-moz-appearance: none;
width: 1.2em;
height: 1.2em;
border: 1px solid black;
background: #666666 url(images/ui-bg_highlight-soft_50_666666_1x100.png) 50% 50% repeat-x;
}
問題がinput[type="range"]::-webkit-slider-thumb,
ビットです。それを削除し、Firefoxは正常に動作します。また、::-webkit-file-upload-button
,::selection
などの他の構文と、::-webkit-...
ラベルを使用しているその他のすべてのものについても同様です。 ::-moz-selection
のように、自分の::-moz-...
というラベルを認識します。
Webkitは、::-moz-
というラベルを無視しているようです。
Firefoxに::-webkit-...
ラベルを無視させる方法や、CSSブロックごとに複数のコピーを維持することなくこの問題を処理する方法はありますか?
ChromeとFirefoxの新しく更新されたバージョンを使用しています。
WebKitが ':: - moz-'というラベルを無視するとはどういう意味ですか?とにかく、その接頭辞を持つ擬似要素だけを無視して、ルールを適用しますか? (これではないと思う...) – BoltClock
@BoltClock私は、WebKitがレンダリングするということです。 ':: - moz-'ラベルがあたかもそこになかったかのように。その接頭辞を持つ疑似要素だけを無視します。 もしあなたが 'div、span :: - moz-whatever、p {color:red; } '、WebKitはdivとpにルールを適用します。 – Martijn