从嵌入的 Google Sheet 中删除 Google Border

Question

从嵌入的 Google Sheet 中删除 Google Border

rei*_*n21 3 html javascript css google-sheets google-apps-script

我希望将 Google 表格嵌入到 Google 扩展程序中。很简单——只需使用自动生成的嵌入代码并将其粘贴到 html 文件中即可。这就是我所做的：

<html>
  <link rel="stylesheet" href="extension.css">
  <iframe
    width="250px"
    height="250px"
    src="https://docs.google.com/spreadsheets/d/e/2PACX-1vQhhQM1ag9M_exkDEV8omFWuI5-4tRizOZ5pl0ZzxpAEJ3rHfWzWilEzjgV4jwpyEj2aaTUkfQx6DRK/pubhtml?gid=1478993491&amp;single=true&amp;widget=true&amp;headers=false">
  </iframe>
</html>

Run Code Online (Sandbox Code Playgroud)

结果是这样的：https : //imgur.com/CopCfvL。我只想要带有“TEAM”和“SCORE”列的表格，有没有办法摆脱谷歌边界（即“Color Wars Scoring：Sheet2”和下面的标签）？我一直在寻找删除它的内置方法，似乎曾经有过，但现在没有了。话虽如此，我觉得应该有一个足够简单的解决方法，可能是使用 JavaScript。我只是不够了解，无法弄清楚。

感谢您的帮助！

Answer 1

Sta*_*eta 5

iframe {
  margin-top: -30px; /* Cut off top bar */
  margin-bottom: -30px; /* Cut off bottom bar */
}

div {
  overflow: hidden; /* Makes cutoff work */
  border: 2px solid black; /* Just for aesthetics, can be removed */
  display: inline-block; /* Fit div to contents */
}

Run Code Online (Sandbox Code Playgroud)

<html>
  <link rel="stylesheet" href="extension.css">
  <div>
  <iframe
    width="250px"
    height="250px"
    src="https://docs.google.com/spreadsheets/d/e/2PACX-1vQhhQM1ag9M_exkDEV8omFWuI5-4tRizOZ5pl0ZzxpAEJ3rHfWzWilEzjgV4jwpyEj2aaTUkfQx6DRK/pubhtml?gid=1478993491&amp;single=true&amp;widget=true&amp;headers=false">
  </iframe>
  </div>
</html>

Run Code Online (Sandbox Code Playgroud)

这不是最漂亮的事情，但我认为我们可以使用容器<div>元素和负垂直边距来实现您想要的。

归档时间：	5 年，4 月前
查看次数：	862 次
最近记录：	5 年，4 月前