0

在 IE8 中，当字段聚焦时，它看起来是点状的。此外，在输入密码字段时，它会显示奇怪的符号（这个错误也在 Chrome 中，但在其他看起来不错）。

IE截图：https ://www.dropbox.com/s/s2b5mpjbyrfn8fh/ie_focused.png

Chrome 截图：https ://www.dropbox.com/s/1zi8eq7zposn6c9/chrome.png

CSS：

.field input {
font-size: 14px;
border: 1px solid rgba(98,141, 40, 0.5);
-webkit-background-clip: padding-box; /* for Safari */
background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
border-radius:5px;
-moz-box-shadow: inset 0 0 1px 1px rgba(98,141, 40, 0.2);
-webkit-box-shadow: inset 0 0 1px 1px rgba(98,141, 40, 0.2);
box-shadow: inset 0 0 1px 1px rgba(98,141, 40, 0.2);

}

.field input:focus{
font-size: 14px;
-moz-box-shadow: 0 0 3px 3px rgba(98,141, 40, 0.2);
-webkit-box-shadow: 0 0 3px 3px rgba(98,141, 40, 0.2);
box-shadow: 0 0 3px 3px rgba(98,141, 40, 0.2);
border: 1px solid rgb(98,141, 40);
border-radius:5px;
}

添加 HTML 表单

    <form accept-charset="UTF-8" action="/users/sign_in" class="login" id="new_user" method="post" novalidate="novalidate"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓"><input name="authenticity_token" type="hidden" value="U+7u2UTO/3LS4dHOL21PgMpln5qZfrEWfwvnN/fxN6A="></div>
<div class="field2">

  <label for="user_email">E-mail Adress</label>
  <input id="user_email" name="user[email]" size="30" type="email" value="">
</div>

  <div class="field2">
    <label for="user_password">Password</label>
     <input id="user_password" name="user[password]" size="30" type="password"> 
</div>

问题可能出在哪里？

4

2 回答 2

1

嘿现在清除默认轮廓

像这样

.field input:focus{
outline:0;
}
于 2012-06-22T10:26:07.830 回答
1

对于字体，更改密码框上的字体：

#user_password {
    font-family: sans-serif;
}
于 2012-06-22T12:12:07.360 回答