You talk about the fact that you are allowed to use HTML5 CSS but I suppose you can make use of JavaScript files too. Also no server side technology as the computer that will host the course doesn't allow out connection or installing any software on the machine.
So the question is: How it is supposed the other users of the mini course to access it from their computers? So I suppose internal LAN connections with shared folders are allowed and configured on the host computer (the one in which the course is stored) and all the LAN workstations.
I suggest some little different approaches.
First I'd suggest the use as database file, just js files with js or json objects hard-coded into them that contain your questions/answers.
The structure/framework
Than I'd suggest to change a little bit the structure of the folders.
- [Main folder of the Course]
├ [database]
│ └ queryandanswer-db.js // query and answer database, just JavaScript with hard-coded object containing the queries and answers
├ [functions]
│ └ function.js
├ [images]
│ ├ image1.jpg
│ ├ image2.jpg
│ └ imageN.jpg
├ [styles]
│ └ mainstyle.css
├ index.html
├ lecturepage1.html
├ lecturepage2.html
└ lecturepageN.html
This should work.
Nevertheless, to create a local website to be used on your own machine and local area network, your best solution remains to install a server software to manage your web site with. You don't need to have a dedicated computer to do that, if your needs are not big enough to. A lot of server software are out there and a lot of them are open source for example Xampp and some of them don't even need to be installed, just executed because they are portable versions. There are also very little solutions as Everything (no installation required since exists a portable version) that have a little built-in server in it that is able to search files and serve them to browsers on other computers on local area network (or even VPNs implemented for example with Hamachi). Also some solutions are portable so no installation is required on the computer.
I'm using it for very narrowed needs, and might be for some others needs could work too, but not for php website.
If you use the application on one computer only (just the host) you could use local storage or indexDB features of the browser it self to manage a local database to save answers from users.
But if your needs are more important I would go for softwares as Xampp and phpMyAdmin or similar solutions that are more versatile and powerful, some even portable so no need to install them.
Also, you don't mention in your OP what operative system you have on your host computer that will host the course. If you have a Windows OS, might be that it has already being installed Microsoft Internet Information Services in it: might be that such a solution could also work too for such needs.
Loading database in you limited scenario
In you scenario can be tricky but a solution can be the use of the <script> tag that is able to into HTML different types of files not only javascripts functions as:
<script async src="Scripts/Functions.js"></script>
but it can also load a database, for instance:
<scirpt src="db/mydbfile.db"></script>
The extension of the database file can be any extension you want as long as it contains text specifically formatted for your needs, even a custom extension: into a project of mine I experimented with the *.db file extension and also with *.json, *.csv, *.txt, *.tsv, *.ext and more...
Also you can do even do something like the following to load different db files dynamically:
function includeJsDBFile(dbFileUrl)
{
var dbDir = 'DB/';
var jsEl = document.createElement('script');
jsEl.src = dbDir + dbFileUrl;
document.head.appendChild(jsEl);
}
There is a very little caveat thought: inside the *.db files, you have to use a special structure into your database files to make the data they hold available to javascript. This is it
var db =
`
your question 1 here
your question 2 here
your question 3 here
your question n here
`
The database file structure is made using back ticks ` and inside it can be contained any data you need.
At this point each record can be separated into data fields as you wish.
After inserting the <script> tag that points to your database, you have access to the db variable contained in it as any other javascript variable and you can get it and manipulate its content as usual, as any other variable. For example doing:
let myDB = db.split(recordSeparator);
will give you an array of records that can be further manipulated.
Notice that recordSeparator is the normal new line separator that works for you, for example '\n' or '\r\n' or '\r': it depends on your DB file format and Operating System.
will put into the variable myDB the content
`
your question 1 here
your question 2 here
your question 3 here
your question n here
`
For saving data
Every user can save data (his/her own session) from you html application to local disk and even reload it.
I suggest to use the blob approach for doing that.
Basically your javascript will prepare the blob to save as file on disk.
About that I suggest to search: Save to Local File from Blob or go directly to
Save to Local File from Blob, to start with.
