css中怎么设置展开全部

在CSS中，我们可以使用伪元素来设置展开全部文章的效果。具体实现方法如下：
首先，在HTML文章中，我们需要使用p标签来分段。文章的每一段都需要给一个唯一的id属性，方便我们在CSS中控制样式。例如：

<p id="p1">这是第一段文字。</p>
<p id="p2">这是第二段文字。</p>
<p id="p3">这是第三段文字。</p>
...... 

然后，在CSS中，我们可以使用:before伪元素来实现展开全部效果。首先，将所有的段落隐藏：

p {
  display: none;
} 

接着，定义展开按钮的样式。我们可以使用::before伪元素来添加文本内容和图标，并设置样式：

a.expand::before {
  content: "展开全部";
  display: inline-block;
  color: #333;
  font-size: 14px;
  line-height: 24px;
  padding-right: 16px;
  background: url(../images/expand-icon.png) no-repeat right center;
} 

这里的.expand表示展开按钮的class名，我们需要在HTML中添加这个class。其中，background属性设置了展开图标（假设图片路径为../images/expand-icon.png），且将图标放在了文字右侧。
最后，当用户点击展开按钮时，我们需要将所有的段落显示出来。我们可以使用:checked伪类和~兄弟选择器来实现：

#expand:checked ~ p {
  display: block;
} 

这里的#expand表示展开按钮的id，我们需要在HTML中添加一个复选框元素，并指定这个id。当#expand被选中后，所有的兄弟元素中的段落都将显示出来。
最终，HTML代码如下：

<input id="expand" type="checkbox">
<a class="expand" href="#" for="expand"></a>
<p id="p1">这是第一段文字。</p>
<p id="p2">这是第二段文字。</p>
<p id="p3">这是第三段文字。</p>
...... 

展开按钮通过一个空的a标签实现，这里的for属性和input元素的id属性对应，可以实现点击按钮勾选复选框的效果。
综上，使用CSS设置展开全部文章的效果需要结合伪元素、选择器和HTML标签等多个技巧，需要一定的CSS基础和逻辑思考。