html - 手持设备的样式表可以跳过加载图像吗

Question

我有一个用于台式机的样式表，还有一个用于手持设备的样式表。网页在桌面上显示时会显示一些图像，但在手持设备上显示时会隐藏这些图像。该页面显示为专为台式机和手持设备设计的。

当我检查服务器日志时，我发现手持设备实际上仍在加载图像，只是没有显示它们。有没有办法阻止手持设备完全加载图像，因为它不需要它们，而不必维护两组网页？可以只使用样式表来完成吗？

提前致谢。

雷蒙德

score 1 · Accepted Answer

包括您不想在移动设备上显示的图像作为背景图像。在浏览器样式表中，您可以使用

.element { 
    background: #FFF url('image.png') no-repeat left top; /* or whatever */
}

而在手持样式表中，您只是不设置背景图像，因此，根据具体用法，您可以使用

.element {
    display: none;
}

或者

.element { 
    background: #FFF;
}

但是，之后将无法<img src="" />通过 CSS 规则删除您包含的图像（只是display: none等等，但这不会阻止它们加载，正如您所注意到的）。

score 0 · Accepted Answer

在标记之前发送每个 HTTP 标头的样式表：

Link: <compact.css>; rel="stylesheet"; media="handheld"

然后最常用的手持浏览器——Opera——将不会加载图像。然而，WebKit (Safari) 仍然可以——甚至是隐藏元素的背景图像！

2 回答 2