html - 与 Border-Radius 的谷歌浏览器相关的问题

标签 html css google-chrome

我有以下CSS类

form input[type="text"], form input[type="email"], form input[type="password"], form select, form textarea {
    border: 1px solid #CCCCCC;
    border-radius: 3px 3px 3px 3px;
    padding: 2px 0;
}

以及以下 html 和 Java 脚本:

<input type="text" id="txt1" style="width:300px;" />
    <input type="button" id="btn" value="click here" class="medium required" onclick="return validate();"/>

<script language="javascript">
    function validate()
    {
         if (document.getElementById('txt1').value == '') {

            document.getElementById('txt1').style.borderLeft = "5px solid red";

            return false;
        }


    }
</script>

它在 Mozila 中有效,但在谷歌浏览器中,只要验证触发,输入框就会在 javascript 中完全应用 css,但它还会创建 1px 实体的顶部和底部边框

您可以查看此示例:http://jsfiddle.net/unloco/VFBT3/3/

我该如何解决这个问题?谢谢。

最佳答案

似乎是 border-radius: 3px 3px 3px 3px;-webkit-border-radius: 3px 3px 3px 3px; 如果你从CSS,那么 Chrome 就没有问题了

比照 - http://jsfiddle.net/VFBT3/20/

关于html - 与 Border-Radius 的谷歌浏览器相关的问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8722933/

相关文章:

html - 如何为不同条目创建具有不同背景图像的有序列表 (HTML/CSS)?

angular - 检测关闭浏览器 Angular 12 的事件

javascript - 尝试在模糊或单击时将数据从一个文本框复制到另一个文本框不起作用javascript

javascript - 使用 Javascript 将 HTML 文件转换为 Excel 文件

javascript - document.querySelector() 对不在 DOM 中的元素?

google-chrome - 撤销 'Store files'权限

google-chrome - 从 OS X 上的 Chrome 获取最前面标签的 URL?

html - CSS 动画不工作

css - Form-horizo​​ntal 将 form-group 拉到右边

css - 如何从 flexbox 中的所有包装行中删除左右边距(没有 nth-child 或 js)