1

私はこれを理解できないようです。別の目が必要です。

パスワード入力ボックスのスタイルを設定して、テキスト入力ボックスと同じように表示/反応させようとしています。

HTMLは次のとおりです。

<fieldset class="contact">
    <label for="full_name">Purchasing Account ID:</label>
    <input type="text" id="acc_id" name="acc_id" size="13" />
    <label for="email_address">Email Address:</label>
    <input type="text" id="email_address" name="email_address" size="13" />
    <label for="password">Password:</label>
    <input type="password" id="pw" name="pw" size="13" />
</fieldset>

CSSは次のとおりです。

form input[type=text], form input[type=password] {
    width: 306px;
    background: #f3f3f3;
    border-top: 1px solid #dedede;
    border-left: 1px solid #dedede;
    border-right: 0;
    border-bottom: 0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 10px 10px;
    font-size: 12px;
    color: #373737;
    -moz-box-shadow:inset 3px 3px 5px #e9e9e9;
    -webkit-box-shadow:inset 3px 3px 5px #e9e9e9;
    box-shadow:inset 3px 3px 5px #e9e9e9;
}
form input[type=text]:focus, form input[type=password]:focus, form textarea:focus {
    border: 3px solid #c70000;
}

パスワード入力フィールドがCSSをまったく取得していない理由について何か考えはありますか？Google Chromeで調べたところ、CSSがパスワード入力フィールドにまったく適用されておらず、Firebugも同じことを示しています。

4

3 に答える 3

1

このアプローチを試した場合はどうなりますか？cssクラスを入力に追加してから、それらのクラスを介してスタイルを適用します。

http://jsfiddle.net/zr6yB/

<fieldset class="contact">
    <label for="full_name">Purchasing Account ID:</label>
    <input type="text" id="acc_id" name="acc_id" size="13" class="input-generic" />
    <label for="email_address">Email Address:</label>
    <input type="text" id="email_address" name="email_address" size="13" class="input-generic" />
    <label for="password">Password:</label>
    <input type="password" id="pw" name="pw" size="13" class="input-generic" />
</fieldset>​

CSS（省略形）

.input-generic {
    width: 306px;
    ...etc...
}
于 2012-05-26T04:29:48.747 に答える
1

これを試して：

.Div_Class_Name input[type=text], .Div_Class_Name input[type=password] {
    background:#e5e2b6;
    border:2px solid #741a01;
}
于 2013-07-25T06:34:24.893 に答える
0

理解した。CSSインクルードの参照は、開発コピーではなく、ライブコピーを参照していました。

于 2012-05-26T05:32:13.913 に答える