我正在为网站使用 Bootstrap。显然 bootstrap 默认所有图像的宽度和高度 = 100%。
该站点包含来自广告服务器的广告,其中包括用于跟踪印象的跟踪像素等。这些像素图像的内联大小为 0,但 css 样式覆盖了它。
问题在于有时 img 像素不是有效的图像文件,因此图像在框中显示有小“x”以表明图像丢失。由于无法知道此图像的“真实”大小,因此浏览器会显示一个小方框,可能是 15 或 20 像素的正方形。
我已经为一些像素添加了样式,这些样式通过名称来识别它们并将它们的大小设置回 0,但现在我有一个像素没有我可以引用的名称或 ID。
我需要做的是至少从广告所在的容器中“删除”默认的“自动”图像大小。我不想从 Bootstrap css 文件中删除它,因为它随时都会中断我升级(以及可能破坏其他 Bootstrap 功能)。
有什么想法吗?
最佳答案
如果您有“丰富”的 HTML 横幅,您应该始终将它们加载到 iframe 中。这不仅使它们对您的问题所说明的主页 CSS 不敏感,而且反过来确保它们不会破坏您自己的布局,它还可以防止许多可能的 XSS 攻击。不要相信应用程序中的第三方代码,无论是为了维护布局还是为了安全。
iframe 方法的另一个优点是,横幅使用的外部资源(例如图像)通常可能从中央 CDN 缓慢加载,并且被 iframe 延迟到包含页面加载后最后加载 - 因此广告永远不会减慢您的用户体验。
除了框架之外,确实没有其他方法可以可靠地为少数容器元素取消“某些”CSS - 这不是 CSS 应该做的,它的全部目的是对整个文档是全局的。
关于html - CSS Image size auto 使跟踪像素显示为丢失的图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18582716/