20170927自己做的第一个网页
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了20170927自己做的第一个网页相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>作业</title> </head> <body> <table border="0" cellspacing="0" cellpadding="0" width="100%"><!-- 网页采用5行3列,头、身、脚的布局 --> <thead><!-- 表格头部,第1行 --> <tr bgcolor="e1f2f9"><!-- 顶部 --> <td width="15%"> <img src="images/logo.png" alt="慕课网"/> </td> <td align="center" valign="middle" width="70%"> <b>学校概括 机构设置 师资队伍 科学研究 招生就业 图书馆 校长信箱 校园导航</b></td> <td align="left" valign="middle" width="15">快速通道 <select><!-- 选项 --> <option>Volvo</option> <option>baidu</option> <option>yahoo</option> </select> </td> </tr> </thead> <tbody><!-- 页面主体 --> <tr><!-- banner区,第2行 --> <td colspan="3"><!-- 三列并一列,插图 --> <img src="images/banner.jpg" width="100%" height="350px"/> </td> </tr> <tr><!-- 新闻区,第3行 --> <td colspan="3"><!-- 三列并一列,嵌套表格三行三列 --> <table align="center" cellspacing="20px"> <tr><!-- 嵌套第一行 --> <td> <h3>慕课快讯 基层风采 媒体聚焦 慕课视频 >></h3> <p>> 慕课平台课程扩容 涵盖拖得领域 12-30</p> <p>> 李克强主持座谈会 葛优刘国梁被邀请进中南海 12-30</p> <p>> 太君演习“歼灭”解放军 专家:自欺欺人 12-30</p> <p>> 气象局停发霾预警?回应:正协商联合发布机制 12-30</p> <p>> 独家:小米影业解散宣发部门 宣布成立一年后刹车 12-30</p> <p>> “哑巴群众”开口说话 是稿件有误还是新闻造价? 12-30</p> <p>> 要置业,看看2017全球楼市掘金路线图 12-30</p> <p>> 王健林与房地产越来越远?贾跃亭与房地产越来越近 12-30</p> </td> <td> <h3>慕课快讯 基层风采 媒体聚焦 慕课视频 >></h3> <p>> 慕课平台课程扩容 涵盖拖得领域 12-30</p> <p>> 李克强主持座谈会 葛优刘国梁被邀请进中南海 12-30</p> <p>> 太君演习“歼灭”解放军 专家:自欺欺人 12-30</p> <p>> 气象局停发霾预警?回应:正协商联合发布机制 12-30</p> <p>> “哑巴群众”开口说话 是稿件有误还是新闻造价? 12-30</p> <p>> 独家:小米影业解散宣发部门 宣布成立一年后刹车 12-30</p> <p>> 要置业,看看2017全球楼市掘金路线图 12-30</p> <p>> 王健林与房地产越来越远?贾跃亭与房地产越来越近 12-30</p> </td> <td valign="middle" align="left"> <img src="images/weixin.png"/> </td> </tr> <tr><!-- 嵌套第二行 --> <td><b>近期专题</b></td> <td></td> <td></td> </tr> <tr align="center"><!-- 嵌套第三行,底部三图 --> <td> <img src="images/1.png"><br/>教育发展基金专题 </td> <td> <img src="images/2.png"><br/>教育发展基金专题 </td> <td> <img src="images/3.png"><br/>教育发展基金专题 </td> </tr> </table> </td> </tr> <tr><!-- 友情链接区,第4行--> <td colspan="3" bgcolor="e1f2f9" align="center" valign="middle" height="60px"><!-- 三列并一列 --> 文化站点 信息服务 校友会 OA系统 教务管理系统 网络教学平台 vpn服务 acm/oj 旧版入口 站群系统 </td> </tr> </tbody> <tfoot><!-- 页脚部分,,第5行 --> <tr align="center" valign="middle" bgcolor="#89a9bd" ><!-- 商标等 --> <td colspan="3" height="100px"><!-- 三列并一列 --> Copyrigth © 2017 imooc.com All Rights Reserved | 京ICP备 13046642号-2 </td> </tr> </tfoot> </table> </body> </html>
从开始学习web前端,到现在已经是第七天,按照慕课网的课程流程,自己做了第一个网页(单纯的只使用html标签做的网页)。看到成果,这对于现在情绪处于人生低谷的我来说是一种莫大的鼓励!这也坚定了继续学习的信心!加油!
发现的问题和解决方法:
1.用table表格制作网页布局,发现表格和网页头部、左右都有一定的空白距离,于是查看图片------没有问题,测试cellspacing.cellpadding等等其他属性,发现没有卵用。于是不得不百度一下,发现了解决方法在所学知识之外,通过新标签的添加,发现问题解决了。目前并没有加入网页里。
2.在制作网页的过程中,对于table、tr、td的标签属性有了进一步的了解。align、valign、width、height、color等等等等,这些标签并不是通用的。比如tr标签貌似并没有width和height标签(也可能是我学的不全),等所有初级课程学完之后再回头去学习w3school的知识,届时再做补充和修改。
注:我发现我的性格真适合做web,发现了问题就要刨根问题去解决,这样解决可以那么那样解决行不行,页面布局不协调就想着做的更好,标签就要码的整整齐齐,这样看的才舒服嘛,哈哈哈哈哈,love it!
以上是关于20170927自己做的第一个网页的主要内容,如果未能解决你的问题,请参考以下文章