javascript - CSS3 Pie.htc 和密码输入字段

Question

我正在尝试使用 css3pie为了在 IE8 中添加对边框半径的支持。

我已经为使用 border-radius 的样式添加了正确的行为，它几乎是完美的，只是在将样式应用于密码输入字段时出现了很多问题，例如

<input name="txtPassword" type="password" id="txtPassword" />

有时它会很好地加载元素，但大多数时候，如果我对其应用 PIE.htc 行为，密码字段不会呈现在我的文档中。

如果我将控件的 TextMode 设置为 Text 例如type="text" 然后它会正常工作，但我失去了隐藏用户在密码字段中输入的功能。应用于字段的样式如下:

#login-form input, a.btn-login {
   margin-bottom: 10px;
   width: 320px;
   border-radius: 20px;
   font-size: 18px;
   position: relative;
   behavior: url(../CMSScripts/Custom/PIE.htc);
}

以前有其他人使用 PIE.htc 遇到过这个问题吗？你是怎么解决的？

Answer 1

好的，所以我在一般输入方面遇到了这个问题，有时无法使用 css3pie 进行渲染。 如果你在你的元素上使用相对长度，比如 em 或百分比，它可能不起作用， 所以使用 PX 来设置输入元素的长度。

或者您的 apache 无法识别 htc 扩展名。 所以将它添加到你的 htaccess 文件中:

AddType text/x-component .htc

或者可能是你的PIE.htc的路径不对。为了确保我将文件与我的 css 文件放在一起。

或者使用以下代码将 css 添加到您的输入类型文本，使其看起来像输入类型密码:

input[type="text"] {
    -webkit-text-security: disc;
/* with this code people won't be able to copy/paste the text in the input */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: moz-none;
    -ms-user-select: none;
    user-select: none;
}

希望我能救你!