Всем спасибо за ответы!
Я тут набросал код, но почему то не работает(
<body>
<div class="container">
<div class="filter__container">
<h2>Показать студентов</h2>
<ul class="filter__list">
<li class="filter__list-item">
<label for="">по ФИО</label>
<input class="filter" type="text" id="fio">
</li>
<li class="filter__list-item">
<label for="fac">по факультету</label>
<input class="filter" type="text" id="fac">
</li>
<li class="filter__list-item">
<label for="date-start">по году начала обучения </label>
<input class="filter" type="text" id="date-start">
</li>
<li class="filter__list-item">
<label for="date-end">по году окончания обучения</label>
<input class="filter" type="text" id="date-end">
</li>
</ul>
</div>
<form class="form">
<h2> Добавить студента</h2>
<ul class="list">
<li><label for="student__name">Имя</label>
<input class="student" id="student__name" type="text"></li>
<li><label for="student__sname">Фамилия</label>
<input class="student" id="student__sname" type="text"></li>
<li><label for="student__lname">Отчетство</label>
<input class="student" id="student__lname" type="text"></li>
<li><label for="student__bdate">Дата рождения</label>
<input class="student" id="student__bdate" type="date"></li>
<li><label for="student__startLearn">Год начала обучения</label>
<input class="student" id="student__startLearn" type="text"></li>
<li><label for="student__faculty">Факультет</label>
<input class="student" id="student__faculty" type="text"></li>
<button class="btn-add">Добавить судента</button>
</ul>
</form>
<table>
<thead>
<tr>
<th>ФИО</th>
<th>Факультет</th>
<th>Дата рождения</th>
<th>Год обучения</th>
</tr>
</thead>
<tbody id="mytable"></tbody>
</table>
</div>
<script src="js/main.js"></script>
</body>