我在谷歌电子表格中有一张图片。按下按钮会触发脚本,该脚本应该打开一个风格化的表格。相反,它会打开一个表格,但无法对其应用 CSS 样式。我阅读了关于制作单独的文件样式并将包含在主 HTML 文件中的 Google 文档,如下所示
// <?!= include('stylesheet'); ?>
如何让脚本真正处理 CSS 样式?
gs文件:
function include(filename) {
return HtmlService.createHtmlOutputFromFile(filename).getContent();
};
function openDialog() {
var html = HtmlService.createHtmlOutputFromFile('Stundu_laiki')
.setHeight(600);
SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
.showModalDialog(html, 'Stundu laiki')
}
带有表格 CSS 的 stylesheet.html 文件
<style>
.w3-table,.w3-table-all{}.w3-table-all{border:1px solid #ccc}
.w3-table-lined tr:nth-child(odd){background-color:#fff}.w3-table-lined tr:nth-child(even){background-color:#f1f1f1}
.w3-table-all tr:nth-child(odd){background-color:#fff}.w3-table-all tr:nth-child(even){background-color:#f1f1f1}
.w3-bordered tr,.w3-table-all tr{border-bottom:1px solid #ddd}.w3-striped tbody tr:nth-child(even){background-color:#f1f1f1}
</style>
stundu_laiki.html 带一张桌子
<!DOCTYPE html>
<html>
<head>
<base target="_top">
**<?!= include('stylesheet'); ?>**
</head>
<body>
<table width="98%" border="1" cellpadding="3px" cellspacing="0" style="w3-table-all">
<tr>
<td width="23%">1.</td>
<td width="77%">8:30 - 9:10</td>
</tr>
<tr>
<td>2.</td>
<td>9:20 - 10:00</td>
</tr>
<tr>
<td>3.</td>
<td>10:10 - 10:50</td>
</tr>
<tr>
<td>4.</td>
<td>11:05 - 11:45</td>
</tr>
<tr>
<td>5.</td>
<td>12:00 - 12:40</td>
</tr>
<tr>
<td>6.</td>
<td>13:10 - 13:50</td>
</tr>
<tr>
<td>7.</td>
<td> 14:00 - 14:40</td>
</tr>
<tr>
<td>8.</td>
<td>14:50 - 15:30</td>
</tr>
<tr>
<td>9.</td>
<td>15:35 - 16:15</td>
</tr>
</table>
<h2> Saīsināto dienu stundu laiki</h2>
<table width="98%" border="1" cellpadding="3px" cellspacing="0" class="w3-table-all">
<tr>
<td width="23%">1.</td>
<td width="77%">8:30 - 9:00</td>
</tr>
<tr>
<td>2.</td>
<td>9:10 - 9:40</td>
</tr>
<tr>
<td>3.</td>
<td>9:50 - 10:20</td>
</tr>
<tr>
<td>4.</td>
<td>10:35 - 11:05</td>
</tr>
<tr>
<td>5.</td>
<td>11:20 - 11:50</td>
</tr>
<tr>
<td>6.</td>
<td>12:20 - 12:50</td>
</tr>
<tr>
<td>7.</td>
<td> 13:00 - 13:30</td>
</tr>
<tr>
<td>8.</td>
<td>13:40 - 14:10</td>
</tr>
<tr>
<td>9.</td>
<td>14:15 - 14:45</td>
</tr>
</table>
</body>
</html>
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句