css - 定位 div 的所有直接子级(图像除外)

Question

是否可以定位一个 div 的所有直接子级(图像除外)？使用 :not 选择器或类似的东西？

例子: http://codepen.io/anon/pen/hlrAg

使用媒体查询，div.wrapper 中的所有元素都应该有一个左/右填充，除了图像。它们应该是视口(viewport)的整个宽度。

我试过:

.wrap > :not(img) {padding: 0 10px;} // (not working - EDIT: works!)

.wrap * :not(img) {padding: 0 10px;} // Creates a double padding on child->child elements.

Answer 1

.wrap > *:not(img) {padding: 0 10px;}(功能与 .wrap > :not(img) 相同。)

演示:http://codepen.io/anon/pen/vtrpF

---

但是，如果 IE8- 或其他不支持 :not 的旧版浏览器令人担忧，请使用以下内容:

.wrap > * {padding: 0 10px;}
.wrap > img {padding: 0;}

演示:http://codepen.io/anon/pen/atfEc