Css 是否可以使用display:none隐藏任何内容？

使用

display:none

暂时或永久隐藏任何内容可以吗？在动态站点中，页面的许多组件来自不同的插件等，很多时候，如果客户端不希望页面上有任何内容，那么我使用

dispaly:none

来隐藏页面上的内容。我并没有从实际的源代码中删除这个东西，因为客户端可以再次请求启用那个东西

那么，让东西隐藏起来不显示有什么优点和缺点：如果我使用

display:none

永远隐藏任何元素，则无

---

在搜索引擎优化、屏幕阅读器、可访问性等方面有什么缺点吗？

如果客户希望删除该页面，则创建该页面的备份，并发布一个实际删除该页面的页面。不要用CSS代替实际删除项目。如果他们决定将来需要它，那么就用你的备份替换你的实时拷贝。如果您处理的是动态输出（在PHP或类似技术的情况下），您可以使用注释停止该特定输出，这样它们就不会包含在响应中。

在执行客户端Ajax时，使用“display:none”隐藏/显示内容是有意义的。通过这种方式，您可以切换视图/选项卡，而无需执行服务器往返

---

当存在安全隐患时，实际上需要从页面标记中删除一些内容。如果用户无权查看某些敏感信息，那么当他们单击“显示源代码”时，这些信息就不应该出现。

Display:none

可以在人们关闭css或使用不支持css的浏览器时隐藏您希望看到的内容。

优点：非常容易做到

缺点：

• 您仍在服务器端加载组件，客户端将下载它们。浏览器根本不会“显示”它们
• 任何使用“查看源”的人都可以看到“隐藏”的值。所以千万不要用它来隐藏敏感信息

---

您可以在服务器端简单地“注释”这些部分，以节省服务器上的大量处理、带宽等。

这里可能还值得一提的是，一些搜索引擎（例如谷歌）确实会对隐藏内容进行评估

使用

display:none隐藏大量文本

是许多搜索引擎发现的关键字垃圾信息之一

---

：）

就可访问性而言，屏幕阅读器很可能无法读取用“显示：无”隐藏的内容。如果您打算这样做，这可能是可以接受的

仅为屏幕阅读器/css提供隐藏内容的一种可能的替代方法是使用此类：

.offscreen {
    position: absolute;
    left: -9000px;
    width: 0;
    overflow: hidden;
}

以及以下HTML：

<h3 class="offscreen">Site Navigation</h3>

站点导航

有关隐藏技术的完整信息：

---

这样做也不会浪费带宽。

创建备份

不，不，最好使用源代码管理！！但一段时间后，该页面中会有许多更改，因此我无法使用备份页面。如果源代码管理不可用，只需对其进行注释即可。@Jitendra:确定您所做的单个更改是否值得备份，然后在必要时保留它们的版本。不要仅仅因为工作量少就走“简单”的路线。让您的客户满意，而不是麻木：）我可以添加一个注释：使用

display:none

隐藏项目并将其从布局中删除，这可能会改变布局。隐藏具有

可视性的元素：隐藏将隐藏布局中的项，就像该项仍然存在但不可见一样。