html - CSS/HTML : Input fields not using CSS styles

Question

我想为表单上的文本输入区域设置样式，但是当我在 css 中为输入创建样式时，它实际上并没有为输入框设置样式。我已经能够设计我的按钮，但不能设计输入框。

<div class="loginContainer">
        <form action ="" method="post">
            <table border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td>
                        <label for="username" class="label">Username</label>
                    </td>
                    <td width="150">
                        <input type="text" name="username" size="25" id="username" autocomplete="off" />
                    </td> 
                </tr>
                <tr>
                    <td>
                        <label for="password" class="label">Password</label>
                    </td>
                    <td width="150"> 
                        <input type="password" name="password" size="25" id="password" autocomplete="off" />
                    </td>
                </tr>
            <input type="hidden" name="token" value="<?php echo Token::generate(); ?>">
            <tr>
                <td>
                    <label for="remember">
                        <input type="checkbox" name="remember" id="remember"> Keep me signed in
                </td>
            </tr>
            <tr>
                <td>
                <input type="submit" class="submit" value="Log in">
            </td>
            </tr>
        </table>
        </form>

这是它的 CSS:

input[type="text"] {
    padding: 4px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    box-shadow: 0px 0px 8px #d9d9d9;
    -moz-box-shadow: 0px 0px 8px #d9d9d9;
    -webkit-box-shadow: 0px 0px 8px #d9d9d9;
    display: block;
}

这最终会创建一个表单，该表单创建:http://i.imgur.com/9Hj9Vie.png

请注意输入字段缺少样式。我应该如何解决这个问题？

Answer 1

未应用边框半径有点奇怪，您可以尝试以下操作(注意缺少引号):

input[type=text] {
    padding: 4px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    box-shadow: 0px 0px 8px #d9d9d9;
    -moz-box-shadow: 0px 0px 8px #d9d9d9;
    -webkit-box-shadow: 0px 0px 8px #d9d9d9;
    display: block;

    /* new stuff */
    border: 1px solid pink;
    outline: 1px solid green;
    background: orange;
}