css - CSS 3行的:not():有没有办法写这个更有效？

有这样的CSS代码（显然在某些情况下是有意义的）：

input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) {
  border:1px solid #fff;
  background-color:#f3f4f5;
}

<div><input type="text" name="alpha" /></div>
<div><input type="email" name="beta" /></div>
<div><input type="number" name="gamma" /></div>
<div><input type="checkbox" name="delta" /> Really?</div>
<div><input type="file" name="epsilon" /></div>
<div><input type="submit" name="zeta" value="Here we go" /></div>

有没有办法这样写：

input:not([type="submit OR checkbox OR radio OR file"]) { // ... }

为了避免这一行：not（）？

最佳答案

你能做的就是缩小它的尺寸。如果我们考虑到所有类型都是已知的，那么我们只有k内部checkbox和f内部file等等。
然后你可以吃这样的东西：

input:not([type*="su"]):not([type*="k"]):not([type*="ra"]):not([type*="f"]) {
  border:1px solid #fff;
  background-color:#f3f4f5;
}

<div><input type="text" name="alpha" /></div>
<div><input type="email" name="beta" /></div>
<div><input type="number" name="gamma" /></div>
<div><input type="checkbox" name="delta" /> Really?</div>
<div><input type="file" name="epsilon" /></div>
<div><input type="submit" name="zeta" value="Here we go" /></div>

注：我可能忘记了一些类型，但逻辑是一样的，找到了最短的单词。