How the image shows up:
Project structure:
Here’s my code:
title.html:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="../assets/css/style.css">
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
</head>
<body>
<div class="div" id="content">
<h1 class="color">Hello I'm Dev Dhawan</h1>
<hr>
<br>
<img src="./app/static/headshot.png" alt="Hello" class="headshot">
<p>Hello</p>
</div>
</body>
</html>
about_me.py:
import streamlit as sl
import header
header.all()
titleHtml = open("./html/title.html", 'r', encoding='utf-8')
sc = titleHtml.read()
sl.markdown(sc, unsafe_allow_html=True)