Как сделать свойства применимыми ко всем потомкам, а не только прямым детям?

Что требуется в CSS для свойств, которые передаются всем детям, а не только прямым детям?Как сделать свойства применимыми ко всем потомкам, а не только прямым детям?

.post>img { 
 
    height: 50%; 
 
    width: 100%; 
 
}

<div class="post"> 
 
    <img src="http://cdn1.theodysseyonline.com/files/2015/06/21/635704919336245232-967016789_Hair.jpg" /> 
 
    <!--This works, appropriately sizing the image. However, if I nest the image, the properties 
 
    seem to disappear:--> 
 
    <a href="http://theodysseyonline.com/ui/4-reasons-why-should-totally-have-crush-bernie-sanders/111812"> 
 
    <img src="http://cdn1.theodysseyonline.com/files/2015/06/21/635704919336245232-967016789_Hair.jpg" /> 
 
    </a> 
 
</div> 
 
<!--The sizing on the image disappears :(How can I make all img descendants of 
 
    .post inherit .post>img's properties?-->

Второе изображение, которое вложены в a тега, не наследует .post>img «ы свойства.

Я предполагаю, что это потому, что это не прямой ребенок. Как заставить всех img потомков .post унаследовать .post>img propeties?

JsFiddle

источник

2016-03-09 Code M4aster

просто удалить > (ребенка селектор), что делает это применять только к прямым детям.

.post img { 
 
    height: 50%; 
 
    width: 100%; 
 
}

<div class="post"> 
 
    <img src="http://cdn1.theodysseyonline.com/files/2015/06/21/635704919336245232-967016789_Hair.jpg" /> 
 
    <a href="http://theodysseyonline.com/ui/4-reasons-why-should-totally-have-crush-bernie-sanders/111812"> 
 
    <img src="http://cdn1.theodysseyonline.com/files/2015/06/21/635704919336245232-967016789_Hair.jpg" /> 
 
    </a> 
 
</div>

источник

2016-03-09 01:12:14 dippas

В своем коде вы используете селектор ребенка комбинатор (>).

.post > img { ... }

Этот селектор представляет собой отношения родителя/ребенка. В этом случае он нацелен на любой элемент img, который является дочерним элементом .post.

Если вы хотите, чтобы выбрать все потомок вы могли бы использовать Селектор потомков комбинатор.

.post img { ... }

Этот селектор (только пробела) цели всех img элементов, которые являются потомками .post.

Узнайте больше на w3.org:

источник

2016-03-09 01:17:16

Как сделать свойства применимыми ко всем потомкам, а не только прямым детям?

ответ

Смежные вопросы