2

イントラネット アプリケーション用に XUL を試しています。

CSS で問題が発生しました。スタイルの !important ディレクティブは、クラス「エラー」を持つテキスト ボックス要素には影響しません。

textbox.error {
background-color: #F00 !important;
}

-moz-appearance: none; を追加した場合のみ。機能し始めますが、その要素のすべてのスタイルが失われます。

background-color プロパティだけをオーバーロードする方法はありますか (この場合)?

アプリケーションをネイティブの外観にしたいので、これは最適ではありません。

ありがとう

- 編集 -

これは XUL 構造です。

<?xml version="1.0"?>
<?xml-stylesheet href="/_backend/views/css/xul.css" type="text/css"?>

<window
id="workorders-edit-window"
title="{$title}"
orient="horizontal"
width="500"
height="400"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<vbox flex="1" orient="vertical">

    <groupbox>
        <caption label="Osnovne informacije"/>

        <hbox flex="5">
            <vbox>
                <label control="ref" value="Št. delovnega naloga"/>
                <textbox id="ref" size="10" value="" class="error"/>
            </vbox>
        </hbox>

    </groupbox>

</vbox>

</window>

そしてCSS：

@import url(chrome://global/skin/);

textbox.error {
background-color: #F00;
}
4

1 に答える 1

2

残念ながら、それがシステムの仕組みです。ネイティブ スタイルが必要な場合は、システムによって設定されるプロパティがいくつかありますが、それらをオーバーライドすることはできません。また、ネイティブ スタイル設定を無効にする場合-moz-appearance: noneは、通常はすぐに使用できるすべてのプロパティを定義する必要があります。

ただし、他の CSS プロパティ (ネイティブ スタイルでは決定されないもの) を使用することで、目的の効果を実現できる場合があります。私は自分で解決策を思いつきませんでした。むしろ、findbar コードが何をしているかを調べました。ここでbox-shadowプロパティを使用できることが判明しました。

textbox.error {
  box-shadow: 0 0 0 1em #f00 inset;
}
于 2012-11-28T18:22:08.060 に答える