我需要设计一个响应式网页，其中写有图像和文字。我不是前端极客，所以我真的需要有关如何创建此页面的帮助？我尝试创建此页面，但是我的代码没有响应。由于我在角度组件中执行此操作并使用引导程序，因此我需要知道如何设计此功能？这是我需要设计的页面page
我尝试过的HTML代码
<nav class="navbar">
<a class="navbar-brand" asp-controller="Home" asp-action="Index"><i class="fa
fa-cubes"></i> GEP <span class="header-logo-text">Learning Management
System</span></a>
</nav>
<div class="container-fluid">
<div class="row content">
<div class="center">
<div class="col-sm-9 text-center">
<img src="/assets/images/school.png" alt="Smiley face" style="float:left; border-radius: 50%; width:100px; height:100px;margin-top:50px;">
<h4 align ="left" style="margin-top: 100px;">
School Name/Title
</h4>
</div>
<div class="col-sm-9 text-center">
<hr>
<p>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.</p>
<br>
<div>
<h4 align="left">Information</h4>
<p align ="left">
<img src="/assets/images/boss.png" alt="Smiley face" style="float:right;width:200px;height:160px;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <br>Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.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.
</p>
</div>
<br>
<div>
<h4 align="left" style="padding-left: 220px;">Information</h4>
<p align ="left">
<img src="/assets/images/boss.png" alt="Smiley face" style="float:left;width:200px;height:160px;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <br>Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.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
</p>
</div>
<br>
<br>
<div>
<h4 align="left">Information</h4>
<p align ="left">
<img src="/assets/images/boss.png" alt="Smiley face" style="float:right;width:200px;height:160px;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <br>Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.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.
</p>
</div>
<br>
<hr>
<h4 class="center1"><u>Address</u></h4>
<i class="material-icons" style="color:red;">location_on</i><span id="txt1" style="margin-bottom: 10px;">Address,County,City,District</span>
<hr>
<div class="footer">
<a href=""> Gep Learning Management System</a>
</div>
</div>
</div>