css点击查看全部改变样式的代码

当点击一个元素来展示全部内容时，你可以使用JavaScript和CSS来改变样式。下面是一个示例代码：

HTML:

<div class="content">
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis faucibus nisi ut massa dignissim, eu euismod nisl interdum.</p>
  <p>Sed eget massa quis arcu blandit consectetur. Vivamus euismod dapibus eros, id sagittis mauris accumsan vitae.</p>
  <p>Nulla facilisi. Fusce eget fringilla dolor. Duis ornare, nibh et consectetur finibus, odio ipsum imperdiet enim, eget aliquet ex purus a enim.</p>
  <button onclick="toggleContent()">点击查看全部</button>
</div>

CSS:

.content p {
  display: none;
}

.content.show-all p {
  display: block;
}

JavaScript:

function toggleContent() {
  var contentDiv = document.querySelector('.content');
  contentDiv.classList.toggle('show-all');
}

在这个示例中，`.content p`的样式设置为`display: none;`，这样段落元素会被隐藏起来。当点击"点击查看全部"按钮时，JavaScript中的`toggleContent()`函数会被调用，并且会为`.content`这个div元素添加/删除`show-all`类。而添加了`show-all`类的`.content`元素会应用`.content.show-all p`这个CSS选择器，使得段落元素显示出来。

这样，当点击"点击查看全部"按钮时，段落元素将会显示出来，再次点击则会隐藏起来。