请老师检查作业,谢谢。
来源:3-8 自由编程
weixin_慕少0270060
2021-10-20 21:40:02
<!DOCTYPE html> <html> <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>College</title> <meta name="Keywords" content="Diploma,Degree,Certification"> <meta name="Description" content="A college of education that provides everything you need."> </head> <body> <!-- Header area --> <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 area--> <div class="banner"> <!-- 图片 --> <div class="banner-images"> <img src="./作业素材/images/banner3.jpg" alt=""> </div> <!-- 遮罩层 --> <div class="banner-coverlayer"></div> <!-- 表单 --> <div class="banner-sheet"></div> </div> <!-- About area --> <div class="about"> <!-- about上半部 --> <div class="about-upper"> <h2>ABOUT</h2> <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> <!-- about下半部 --> <div class="about-lower"> <h2>WORD ABOUT US</h2> <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> <p><a href="">EXPLORE</a></p> <p><img src="./作业素材/images/bb3.jpg" alt=""></p> <p>7000</p> <p>分割线</p> <p>Student</p> <p>600</p> <p>分割线</p> <p>Faculty</p> </div> </div> <!-- 图文混排区域 --> <div class="image-text"> <!-- 图片1--> <div class="pic1"> <img src="./作业素材/images/b1.jpg" alt=""> </div> <!-- 文字2 --> <div class="text2"> <h3>Libray</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> <a href="">EXPLORE</a> </div> <!-- 图片3--> <div class="pic3"> <img src="./作业素材/images/b2.jpg" alt=""> </div> <!-- 文字4 --> <div class="text4"> <h3>Libray</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> <a href="">EXPLORE</a> </div> <!-- 文字5--> <div class="text5"> <h3>Libray</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> <a href="">EXPLORE</a> </div> <!-- 图片6 --> <div class="pic6"> <img src="./作业素材/images/b3.jpg" alt=""> </div> <!-- 文字7--> <div class="text7"> <h3>Libray</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> <a href="">EXPLORE</a> </div> <!-- 图片8 --> <div class="pic8"> <img src="./作业素材/images/b4.jpg" alt=""> </div> </div> <!-- Gallery area --> <div class="gallery"> <!-- gallery上部 --> <div class="gallery-upper"> <h2>Gallery</h2> <p>分割线</p> <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> <!-- gallery下部 --> <div class="gallery-lower"> <dl> <dt><img src="./作业素材/images/03-01.jpg" ></dt> <dd>Science Lab</dd> </dl> <dl> <dt><img src="./作业素材/images/03-02.jpg" ></dt> <dd>Indoor Stadium</dd> </dl> <dl> <dt><img src="./作业素材/images/03-03.jpg" ></dt> <dd>Transportation</dd> </dl> <dl> <dt><img src="./作业素材/images/03-04.jpg" ></dt> <dd>Kids Room</dd> </dl> <dl> <dt><img src="./作业素材/images/03-05.jpg" ></dt> <dd>Meditatin Classes</dd> </dl> <dl> <dt><img src="./作业素材/images/03-06.jpg" ></dt> <dd>Kids Play Ground</dd> </dl> </div> </div> <!-- Footer area --> <div class="footer"> <!-- 文字内容 --> <div class="words"> <p>© 2016 imooc.com 京ICP备134046642号</p> </div> </div> </body> </html>
1回答
同学你好,如图所示不建议图片路径中出现中文字符,解析时容易出现问题,一般建议使用英文命名文件以及文件夹名称。
另外,HTML代码结构基本合理,建议优化一下about部分的布局,如图所示
祝学习愉快!
相似问题