如何使用CSS定位和设置特定元素的样式

Question

对于HTML和CSS，我有点像菜鸟但是这里......

不确定它的名称，但在下面的示例中我如何编写CSS以便 ONLY 对每个元素的段落标记进行样式设置？例如，如何编写CSS以仅制作

段落在包装器＆gt;内容中向左浮动

和

段落在包装器＆gt; sideContent中浮动对吗？所有其他段落不受影响。

<div id="wrapper">
    <div id="content">
        <p>lorem ipsum...</p>
    </div>
    <div id="sideContent">
        <p>lorem ipsum...</p>
    </div>
    <div>
        <p>lorem ipsum...</p>
    </div>  
</div>

不确定这是否有效，但有些内容如下：

#wrapper #content p
{
  float: left;
}

#wrapper #sideContent p
{
  float: right;
}

Btw - 这种技术叫做什么？

Answer 1

您的CSS对您要说的内容有效。但是，以这种方式执行此操作会使p在#content div内浮动#content div（p内的#sideContent相同），它们不会继续漂浮在另一段的每一边。 #content和#sideContent仍然会像普通的div一样，第二个会出现在另一个下方。

你最想要的是自己浮动div：

#content
{
  float: left;
}

#sideContent
{
  float: right;
}

请注意，缺少p和#wrapper是不必要的，因为两个div无论如何都应该是唯一的（因为你给了他们一个id）。