Good morning. I am currently working on a final project for my Unix class and it trying to implement some of the stuff learnt through building a web game. One feature that I want to incorporate is the ability to add text over a div as shown in the picture. How would I go about that?

Try including some of your own source code next time, just so we get an idea of what you're having issues with.
But to put text over, try using position: relative, inside a div with a background image of what you want.
Eg.
.parent {
background-image:url("https://picsum.photos/200/300");
width: 800px;
height: 800px;
}
.text {
position: relative;
top: 20px;
left: 40px; /*edit top, left, right, and bottom to change position*/
font-weight: bold;
}
<body>
<div class="parent">
<p class="text">TEXT!</p>
</div>
</body>
If you can't use a background image, try using absolute positioning. Here's a great tutorial for that: https://www.youtube.com/watch?v=P6UgYq3J3Qs