將Google Spreadsheet嵌入到SquareSpace並使其對手機響應

我試圖在Square Space網站上嵌入Google電子表格。不幸的是，我得到的電子表格具有水平和垂直滾動條，每當我切換到移動視圖將Google Spreadsheet嵌入到SquareSpace並使其對手機響應

<div class="sqs-block-content"> 
<iframe width="100%" height="800" src="https://docs.google.com/spreadsheets/d/1BxfLMwwEWjyV-Avp9cWupPnJiwVq3GX6VcVRYuw-XQ0/pubhtml?single=false&widget=false&headers=false" scrolling="no" ></iframe> 
</div>

如何使電子表格響應，使其適合在IFRAME（因此，不會有滾動條，因爲所有列可見）？

編輯：
是否可以操作使用jQuery的內部HTML（iframe的html正文）？我相信應該有辦法或某種方式來實現我想要的。我試着用一些jQuery的庫，也仍然沒有運氣...

來源

2017-08-30 Wasi

如果你想減少大小和內容的，請嘗試以下操作：

width="100%" height="800"

然後，添加以下你的CSS：

iframe { 
    width: 396vw; 
    height: 3200px; 
    border: 0; 
    transform: scale(0.25); 
    transform-origin: 0 0; 
}

來源

2017-08-31 15:27:34 Rounin

好的，電子表格現在適用於移動設備。但是，它也在桌面上縮小，所以桌面上的表單也顯得更小。 – Wasi

您只需將上述樣式放置在移動設備的「@media query」中即可。如果你沒有，我會試圖使用像'@media only screen和（max-width：790px）{...}'或類似的東西。 – Rounin

將Google Spreadsheet嵌入到SquareSpace並使其對手機響應

回答

相關問題