请求老师帮忙检查我的作业
来源：3-8 自由编程
盛兆辉666
2021-06-06 21:49:12
问题描述：
自己写的时候心里不坚定老是怕出错，所以想让老师帮我看一下的代码，看有没有需要改进的地方
相关截图：
相关代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Career Bulider</title>
<meta name="Keywords" content="职业，培训，事业，开创，建设">
<meta name="Description" content="致力于做最好的职业培训">
</head>
<body>
<!-- 页面头部 -->
<div class="header">
<!-- 网页logo -->
<div class="logo">
<img src="images/logo.png" alt="">
</div>
<!-- 右部导航栏 -->
<div class="nav">
<ul>
<li>HOME</li>
<li>ABOUT</li>
<li>GALLERY</li>
<li>FACULTY</li>
<li>EVENTS</li>
<li>CONTACT</li>
</ul>
</div>
</div>
<!-- 页面banner -->
<div class="banner">
<!-- 放置图片 -->
<div class="picture">
<img src="images/banner3.jpg" alt="">
</div>
<!-- 遮罩层 -->
<div class="mask">banner遮罩层</div>
<!-- 表单区域 -->
<div class="form">banner表单</div>
</div>
<!-- 页面主体 -->
<div class="main">
<!-- 关于部分 -->
<div class="about">
<!-- 标题和简短描述 -->
<div class="title-and-short-des">
<h3>ABOUT</h3>
<!-- 分割线 -->
<div class="line">分割线</div>
<!-- 描述 -->
<p>Lorem Ipsum is simply dummy text of the printing and typesetting
industry.Lorem Ipsum has been the industry's standard dummy
text ever since the 1500s.</p>
</div>
<!-- 详细描述 -->
<div class="detail-des">
<!-- 文字描述 -->
<div class="about-content">
<!-- 标题 -->
<h3>A WORD ABOUT US</h3>
<div class="article">
<!-- 描述信息 -->
<P>Praesent dignissim viverra est, sed bibendum ligula congue non. Sed ac nisl et felis gravida
commodo? Suspendisse eget ullamcorper ipsum. Suspendisse diam amet.</P>
<!-- 按钮 -->
<div class="button">EXPLORE</div>
</div>
</div>
<!-- 关于图片 -->
<img src="images/bb3.jpg" alt="">
<!-- 数据区域 -->
<div class="data-area">
<!-- 学生数量板块 -->
<div class="stu-num">
<h3>70000</h3>
<div class="line">分割线</div>
<p>Students</p>
</div>
<!-- 教员数量板块 -->
<div class="fac-num">
<h3>600</h3>
<div class="line">分割线</div>
<p>Faculty</p>
</div>
</div>
</div>
</div>
<!-- 图文混排分享 -->
<div class="show-info">
<!-- 位置一 -->
<div class="pic">
<img src="images/b1.jpg" alt="">
</div>
<!-- 位置二 -->
<div class="word">
<h3>Library</h3>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>
<p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer
took a galley of type and scrambled it to make a type specimen book.</p>
<div class="button">EXPLORE</div>
</div>
<!-- 位置三 -->
<div class="pic">
<img src="images/b2.jpg" alt="">
</div>
<!-- 位置四 -->
<div class="word">
<h3>Library</h3>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>
<p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer
took a galley of type and scrambled it to make a type specimen book.</p>
<div class="button">EXPLORE</div>
</div>
<!-- 位置五 -->
<div class="pic">
<img src="images/b3.jpg" alt="">
</div>
<!-- 位置六 -->
<div class="word">
<h3>Library</h3>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>
<p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer
took a galley of type and scrambled it to make a type specimen book.</p>
<div class="button">EXPLORE</div>
</div>
<!-- 位置七 -->
<div class="pic">
<img src="images/b4.jpg" alt="">
</div>
<!-- 位置八 -->
<div class="word">
<h3>Library</h3>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>
<p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer
took a galley of type and scrambled it to make a type specimen book.</p>
<div class="button">EXPLORE</div>
</div>
</div>
<!-- 展示区域 -->
<div class="gallery">
<!-- 标题和简短描述 -->
<div class="title-and-short-des">
<h3>GALLERY</h3>
<!-- 分割线 -->
<div class="line">分割线</div>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting
industry. Lorem Ipsum has been the
industry's standard dummy text ever since the 1500s.
</p>
</div>
<!-- 详细信息 -->
<div class="detail-info">
<!-- 图一 -->
<dl>
<dt><img src="images/03-01.jpg" alt=""></dt>
<dd>Science Lab</dd>
</dl>
<!-- 图二 -->
<dl>
<dt><img src="images/03-02.jpg" alt=""></dt>
<dd>Indoor Stadium</dd>
</dl>
<!-- 图三 -->
<dl>
<dt><img src="images/03-03.jpg" alt=""></dt>
<dd>Transportation</dd>
</dl>
<!-- 图四-->
<dl>
<dt><img src="images/03-04.jpg" alt=""></dt>
<dd>Kids Room</dd>
</dl>
<!-- 图五 -->
<dl>
<dt><img src="images/03-05.jpg" alt=""></dt>
<dd>Meditation Classes</dd>
</dl>
<!-- 图六 -->
<dl>
<dt><img src="images/03-06.jpg" alt=""></dt>
<dd>Kids Play Ground</dd>
</dl>
</div>
</div>
</div>
<!-- 页面页脚 -->
<div class="footer">
<p>© 2016 imooc.com 京ICP备13046642</p>
</div>
</body>
</html>
尝试过的解决方式：
看着效果图对比，有几处瑕疵。有些地方需要换行有些地方又是挨在一起，我自己尝试过，感觉自己的代码不合理就改回来了，最终代码就是上面这样，也不知道老师用的是啥方法。。。
写回答
2回答
-
老哥带带我啊
1 -
好帮手慕言
2021-06-07
同学你好，整体结构是对的，咱们后面会学习css，可以使用css调整样式哒，祝学习愉快~
1
相似问题