gpt4 book ai didi

css - 无法使样式表工作

转载 作者:行者123 更新时间:2023-11-28 07:33:36 26 4
gpt4 key购买 nike

我正在尝试使用谷歌应用程序脚本创建我的第一个网络应用程序。我正在尝试按照示例进行操作,但它不起作用。我创建了一个 stylesheet.html 选项卡以及我的主要 html 页面。但是我的格式都不起作用。我以为谷歌将文件附加在一起。仅供引用,如果我将它们包含在主页底部,我的样式就可以正常工作。这是我的 code.gs 页面:

function doGet() {
return HtmlService.createHtmlOutputFromFile('frontpage')
.setSandboxMode(HtmlService.SandboxMode.IFRAME);
}

这是我的主页 frontpage.html :

<!DOCTYPE html>
<html lang="en">

<?!= HtmlService.createHtmlOutputFromFile('stylesheet').getContent(); ?>


<!-- google scripts says to not include header & body tags ?? -->

<meta charset="utf-8">
<title>Borah Physics</title> <!-- google syas not to use title tag need another way to set title.-->

<h1><div style="text-align:center">Physics Homework</div></h1>



<!--List of available assignments. This needs to be updated as assignments are added.
Add assignment name and the ssID of the spreadsheet containing the questions.
when clicked need to return value (ssid) as sheetID.-->



<select id="assignment">
<option sheetID="1ajedscAjuXDsUOcQRzru5-bhUIluGn3fPPsoN-Ww5wU">Kinematics 1</option>
<option sheetID="10mCGpLRwv8ETFbW3RwisI45s_x3-ZItatzq_vU0wacs">Dynamics</option>
</select>


<!--Question should be string variable activeQuestion It will get updated when the question number changes.-->

<div id="question">
<br>
<br>
Question Here
<br>

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia
deserunt mollit anim id est laborum.
<br> <br>
</div>


<!-- If question has an image it will go here.-->
<div id="qImage">
Along with image (if needed)
<br>
</div>

<!-- This is the user inputed answer. It needs to be recorded in the response sheet of the spreadsheet and
compared to the correct answer. (in the comparison we need to add a within x% variable so if the answer
is close it is counted as correct. This accounts for thinks like g=10 m/s^2 vs 9.8 m/s^2.-->

<div id="answer">
<label>Answer:</label>
<input type="text" name="answer"/>
<input type="Submit" value="Submit"/>
<br>
<br>
</div>


<!-- bottom navigation list-->

<ul id="nav">
<li><a> </a></li>
<li><input type="button" onclick="previous()" value="Previous"></li> <!-- goes to previous question (calls previous function)-->
<li><a >&nbsp;Correct: 4/12 </a></li> <!-- need to insert variables #correct & total # questions-->
<li><input type="button" onclick="next()" value="Next"></li> <!-- goes to next question (calls next function).-->
<li><a> </a></li>

</ul>

最后是我的 stylesheet.html 页面

        <style>

#assignment{
width: 20%; margin: 10 ;
position: absolute;
right: 10px;
}

#question {
width: 90%; margin: 0 auto;
}

#qImage{
width: 90%; margin: 0 auto;
}

#answer {
width: 90%; margin: 0 auto;
}

#nav {
text-align: justify;
min-width: 400px;
}
#nav:after {
content: '';
display: inline-block;
width: 100%;
}
#nav li {
display: inline-block;
}

</style>

我的输出显示在页面顶部,就好像它是文本一样。所以我没有将样式表连接到首页。我什至还没有尝试去理解函数或 javascript。很多东西要学。 (这是一个物理作业应用程序,我希望在开学前开始工作!)感谢所有帮助。有家教吗?谢谢。

最佳答案

doGet() 函数中将 createHtmlOutputFromFile 更改为 createTemplateFromFile

应该是:

return HtmlService
.createTemplateFromFile('frontpage')
.evaluate()
.setSandboxMode(HtmlService.SandboxMode.IFRAME);

如果一个文件中有一个 scriptlet,它就是一个模板。您的 frontpage 文件中有一个 scriptlet。小脚本是:

<?!= HtmlService.createHtmlOutputFromFile('stylesheet').getContent(); ?>

您还可以从 scriptlet 调用服务器函数,而不是直接在 scriptlet 中使用 HtmlService。

关于css - 无法使样式表工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31363159/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com