在Safari浏览器中使用自定义样式表时，发现本地网页可以正常应用样式，而访问外部网站（例如百度）时却失效，本文将对此问题进行分析。
测试代码如下：
body {
background-image: url("/Users/luxury/Desktop/wallhaven-o5762l.png") !important;
}问题现象：
问题原因：
关键在于URL路径的处理方式不同。
本地网页使用file协议，样式表中的图片路径直接指向本地文件系统。Safari能够正确解析并加载该图片。
而外部网站使用http协议，Safari会将样式表中的图片路径解释为相对于网站根目录的路径，即/Users/luxury/Desktop/wallhaven-o5762l.png会被浏览器尝试从百度服务器加载，显然服务器不存在这个路径，导致图片加载失败（404错误），从而样式表看似失效。 这与使用file协议访问本地资源的机制完全不同。
解决方案：
自定义样式表不应依赖本地文件系统路径。 正确的做法是将图片资源上传到可访问的服务器，并使用相应的网络URL路径。 例如，将图片上传到一个图片托管服务，然后在样式表中使用该图片的公共URL。
进一步验证：
文中提到的将background-image修改为background并添加颜色值，并不能解决根本问题。 即使背景颜色生效，图片仍然无法加载，因为路径仍然指向本地文件系统。
总之，自定义样式表应该遵循网页开发规范，避免使用本地文件路径，而应使用可公开访问的网络资源路径。 这才是解决Safari自定义样式表在不同环境下应用差异的根本方法。
以上就是为什么我在Safari中使用自定义样式表时，自己的网页可以应用，而百度页面却无法生效？的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告![ThinkPHP5快速开发企业站点[全程实录]](https://img.php.cn/upload/course/000/000/068/6253d918a3ce7278.png)
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
422
