CSS将边框应用于除复选框之外的所有输入元素

前端之家收集整理的这篇文章主要介绍了CSS将边框应用于除复选框之外的所有输入元素前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个css类:
input {
    font-family: Arial,Helvetica,sans-serif;
    font-size: 10px;
    border: 1px solid #003399;
}

哪些适用于我想要的大部分内容,但现在我需要一个没有这个边框的复选框,而页面上的其余输入元素继续应用边框。

因此,我创建了额外的css类:

input[type="checkBox"] 
{
    border: none;
}

这可以适用于FireFox和Chrome,但不是8,当我使用开发工具ie来检查元素,我可以看到两种风格都被拿起,但只有当我取消选中输入样式旁边的复选框边框复选框消失。

这是默认值:

这就是我要做的是摆脱边界:

解决方法

为什么不使用:not selector来反转属性选择器?
input:not([type=checkBox])
{
    border: 1px solid #039;
}

如果是IE8或之前的版本,那么您应该为要设置边框的类使用单独的规则,因为它不支持:不(或任何好东西)。

编辑:

input[type=checkBox]
{
    border: none;
}

如果您添加了一个doctype,即使是简单的<!doctype html>

猜你在找的CSS相关文章