CSS显示一个元素的内容在chrome使用F12开发工具

CSS to display contents of one element in chrome using F12 developer tools

本文关键字：chrome 使用 开发工具 F12 元素 显示 一个 CSS      更新时间：2023-09-26

所以只是不要分心的所有垃圾周围的主要内容，在chrome F12 edeveloper工具我添加了这2个样式:

.content {
  display: block !important;
}
body  {
  display: none;
}

然后一切都消失了!类似的事情也适用于可见性(但内容在不可见元素之间变得紧张)

 .content * {
  visibility: visible;
}
body * {
  visibility: hidden;
}

请注意content是从网站到网站的变化，取决于网站的作者决定调用它的主要内容类，如果您可以使用F12开发人员工具与任何网站使用显示无和所有类似于上述代码，请让我知道语法应该是什么。

此外，是否有一种方法来执行一些javascript在Chrome F12调试控制台实现类似的结果?

使用visibility: hidden;和visibility: visible;应该工作良好。

也许你应该把直接应用到body和。content上，而不是它们的所有子元素。

body {
  visibility: hidden;
}
.content {
  visibility: visible;
}

你可以在Stack Overflow上进行测试。但是内容是一个目标ID (#content)

问题是content是body的孩子，所以即使您将内容设置为display: block或visibility: visible。父元素(BODY)被隐藏。因此，它的所有子元素也将被隐藏。

相关文章：