CSS: aside #sidebar {...} против aside # sidebar {...}
В селекторе CSS я не понимаю значения пробела между элементом макета и идентификатором (или классом):
CSS
aside#sidebar{
float:right;
width:30%;
margin-top:10px;
color:#ffffff;
}
aside #sidebar{
float:right;
width:30%;
margin-top:10px;
color:#ffffff;
}
HTML
<aside id = "sidebar">
<h3>What We Do</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</aside>
Спасибо
Теперь, когда я понял концепцию благодаря вашим объяснениям, я понимаю, почему вы думаете, что это повторяющийся вопрос. До понимания концепции он не казался мне повторяющимся вопросом, потому что «пробел / no_space»: - в моем вопросе был между элементом макета и идентификатором. - в предыдущем вопросе был между двумя классами. Я соответствующим образом отредактировал вопрос и включил HTML. Я удалил словесное описание вывода.
Ответы 2
Когда вы помещаете пробел, это отношение родитель / потомок, без него это элемент.
Здесь aside#sidebar означает, что у вашего элемента aside есть боковая панель id.
aside #sidebar - это когда элемент с боковой панелью id является дочерним по отношению к элементу.
Ваши селекторы совершенно разные.
В CSS пробел между аргументами означает «внутри», а отсутствие пробела - «также».
Приведу пример.
div {
padding: 1em;
border: solid 1px blue;
}
.container.foo:before {
content: ".container AND .foo";
}
.container .foo:before {
content: ".foo inside any .container";
}<div class = "container foo">
<div class = "middle foo">
<div class = "inner foo">
</div>
</div>
</div>
Хотя это, безусловно, повторяющийся вопрос, вам необходимо опубликовать свой HTML-код в вопросе. В противном случае, если у вас возникнут проблемы с пониманием концепции, несмотря на текущие ответы, мы не сможем объяснить ее лучше, чем то, что есть сейчас. Ваше словесное объяснение вашего HTML под моим ответом может означать несколько разных структур, поэтому вы всегда должны публиковать фактический код и воздерживаться от словесных описаний кода.