css - 禁用 Scrapeazon iFrame [Wordpress 插件 : Scrapeazon ]

Question

我正试图在这个 website 上对上图中的这个框架进行样式化在这里通过取消水平和垂直的滚动条，另外，我试图增加宽度，但所有的努力似乎都是徒劳的。

#scrapeazon-wrapper {
  position: relative;
  width: 100%;
  overflow: hidden !important;
  -webkit-overflow-scrolling: touch;
}

#scrapeazon-iframe {
  width: 100%;
  height: 90%;
  border: none;
}

由于某种原因，这里的任何内容都不能被覆盖？

用于在 wordpress 上集成的 HTML 简码；

[scrapeazon asin="B074TBRMZK" width="800" height="300" border="false" country="US"]

Answer 1

您不能将 CSS 应用于加载到 iframe 中的 HTML ，除非您可以控制 iframe 中加载的页面由于跨域资源限制。

但是，您可以在 Scrapeazon 插件设置中编辑 CSS。

您可以通过多种方式设置scrapeazon-reviews 的样式 iframe :通过编辑主题的样式表，向每个短代码添加参数，或使用插件的内置响应式样式表。

为 iframe 设置样式在您的主题样式表中，添加名为 scrapeazon-reviews 的类和 scrapeazon-api到你的样式表，然后添加 width , height , border ，以及您想要为这些类设置样式的其他参数。例如，将以下内容复制并粘贴到您的样式表中，使 iframe 成为一个 540×540 像素的无边框正方形:

.scrapeazon-reviews {
   width: 540px;
   height: 540px;
   border: none;
}
.scrapeazon-api {
   width: 540px;
}

为 iframe 设置样式通过使用短代码，添加 width , height , 和 border作为短代码的参数。例如，要以简码格式完成与上述相同的格式化，请使用以下简码:
[scrapeazon asin="<your asin>" width="540" height="540" border="false"]

在 width 后附加一个百分号(%)和 height如果您以百分比而不是像素指定这些值，则为值。您可以选择附加 ‘px’而不是使用像素的百分比符号。如果您只指定数字，ScrapeAZon 将默认为像素。

为 iframe 设置样式通过使用内置的响应式样式表(如果您的网站有响应式设计/主题)，在 ScrapeAZon 设置页面上选择“使用响应式样式”复选框。