5手写HTML语言代码之《在文字中加条横线插入图片》学习网页制作的心得体会.docx

上传人：小飞机

文档编号：3149482

上传时间：2023-03-11

格式：DOCX

页数：10

大小：38.54KB

《5手写HTML语言代码之《在文字中加条横线插入图片》学习网页制作的心得体会.docx》由会员分享，可在线阅读，更多相关《5手写HTML语言代码之《在文字中加条横线插入图片》学习网页制作的心得体会.docx（10页珍藏版）》请在三一办公上搜索。

1、5手写HTML语言代码之在文字中加条横线插入图片学习网页制作的心得体会学习网页制作的心得体会5.手写HTML语言代码之在文字中加条横线、插入图片一、运用<hr>给网页加条横线在以下“教师自制教学软件的背景”后面输入<hr><html><head><title>我的第一个网页</title><meta http-equiv=Content-Type content=text/html;charset=gb2312></head><body bgcolor=#FFFF00><center><font

2、size=6 color=31743F>教师自制教学软件的背景<hr></center><a href=ad.gif target=_blank><img src=a.gif alt=老师板书 with=100 height=100 align=right border=0></a>随着教育体制的改革和信息时代的到来，可能越来越多的同学己经不再适应看着教师的板书、记着笔记的学习方式，教师也开始不习惯将自己的备课笔记一遍又一遍地写在黑板上。一堂40或45分钟的课，老师用于板书的时间不下15 分钟，也就是说真正用于教

3、学的时间不到70 % ，这在知识信息化的21 世纪，己经捉襟见肘了；而且板书的信息含量很小，师生之问互动不强，即使很高明的教师也很难<img src=b.gif alt=课件教学 with=100 height=100 align=left>把黑底白字表现得很形象，因此难免把一些原本很感性的东西解释得比较抽象，让同学难以接受。这时，多媒体演示课件应运而生，顾名思义，多媒体演示课件可习理解为利用图、文、声、像等各种多媒体素材，组成一个可以替代传统的教学板书，并能配合老师讲解、进行课堂内容演示的多媒体程序。随着多媒体技术的发展，现在的多媒体演示课件一般能实现如下几个基本功能：<br&g

4、t1、与课堂上的讲课内容配套，将所讲内容从黑板移植到多媒体计算机中。 2、通过计算机，能把讲课内容按照课堂听讲的习惯演示出来。 3、充分发挥计算机的多媒体特性，制作并利用各种多媒体素材讲解课堂内容。 4、具备一定的交互性，使得师生间能通过课件进行交流，以达到“教学相长”的目的。 </body></html>保存并刷新后，在题目的下面就会出现一条横线。那么“<hr>”是什么意思？它有哪些属性？“<hr>”这个标识，可以加一条横线，我们还可以给它加一些属性，比如<hr size=2 color=666666

5、 with=80% align=right>，意思如下：“size”.是线的粗细“color”.是线的颜色“with”.是线的长度“align”.是线的位置上面网页中的横线修改后就变成如下：<html><head><title>我的第一个网页</title><meta http-equiv=Content-Type content=text/html;charset=gb2312></head><body bgcolor=#FFFF00><center>

6、教师自制教学软件的背景<hr size=2 color=666666 with=80% align=right></center><ahref=ad.gif target=_blank><img src=a.gif alt=老师板书 with=100 height=100 align=right border=0></a>随着教育体制的改革和信息时代的到来，可能越来越多的同学己经不再适应看着教师的板书、记着笔记的学习方式，教师也开始不习惯将自己的备课笔记一遍又一遍地写在黑板上。一堂40或45分钟的课，老师用于板书的时

7、间不下15 分钟，也就是说真正用于教学的时间不到70 % ，这在知识信息化的21 世纪，己经捉襟见肘了；而且板书的信息含量很小，师生之问互动不强，即使很高明的教师也很难<img src=b.gif alt=课件教学 with=100 height=100 align=left>把黑底白字表现得很形象，因此难免把一些原本很感性的东西解释得比较抽象，让同学难以接受。这时，多媒体演示课件应运而生，顾名思义，多媒体演示课件可习理解为利用图、文、声、像等各种多媒体素材，组成一个可以替代传统的教学板书，并能配合老师讲解、进行课堂内容演示的<a href=dmtcxqzcsj.htm>多媒体

8、程序</a>。随着多媒体技术的发展，现在的多媒体演示课件一般能实现如下几个基本功能： 1、与课堂上的讲课内容配套，将所讲内容从黑板移植到多媒体计算机中。 2、通过计算机，能把讲课内容按照课堂听讲的习惯演示出来。 3、充分发挥计算机的多媒体特性，制作并利用各种多媒体素材讲解课堂内容。 4、具备一定的交互性，使得师生间能通过课件进行交流，以达到“教学相长”的目的。 </body></html>二、运用<img src=a.gif alt=老师板书 with=100 height=100>在文字中插

9、入图片一个仅有文字的网页是不能吸引人的，我们在有文字的页面中插入几张图片：第一步：放好图片备用。把已经处理好的图片放在img目录下，它们的名字分别为a.gif、b.gif、c.gif。第二步：输入代码，使网页出现图片。我们在以下网页<html><head><title>我的第一个网页</title><meta http-equiv=Content-Type content=text/html;charset=gb2312></head><body bgcolor=#FFFF00><center><font siz

10、e=6 color=31743F>教师自制教学软件的背景</center>随着教育体制的改革和信息时代的到来，可能越来越多的同学己经不再适应看着教师的板书、记着笔记的学习方式，教师也开始不习惯将自己的备课笔记一遍又一遍地写在黑板上。一堂40或45 分钟的课，老师用于板书的时间不下15 分钟，也就是说真正用于教学的时间不到70 % ，这在知识信息化的21 世纪，己经捉襟见肘了；而且板书的信息含量很小，师生之问互动不强，即使很高明的教师也很难把黑底白字表现得很形象，因此难免把一些原本很感性的东西解释得比较抽象，让同学难以接受。这时，多媒体演示课件应

11、运而生，顾名思义，多媒体演示课件可习理解为利用图、文、声、像等各种多媒体素材，组成一个可以替代传统的教学板书，并能配合老师讲解、进行课堂内容演示的多媒体程序。随着多媒体技术的发展，现在的多媒体演示课件一般能实现如下几个基本功能： 1、与课堂上的讲课内容配套，将所讲内容从黑板移植到多媒体计算机中。 2、通过计算机，能把讲课内容按照课堂听讲的习惯演示出来。 3、充分发挥计算机的多媒体特性，制作并利用各种多媒体素材讲解课堂内容。 4、具备一定的交互性，使得师生间能通过课件进行交流，以达到“教学相长”的目的。 </body>

12、</html>输入代码<img src=a.gif alt=老师板书 with=100 height=100>变成如下：<html><head><title>我的第一个网页</title><meta http-equiv=Content-Type content=text/html;charset=gb2312></head><body bgcolor=#FFFF00><center>教师自制教学软件的背景</cen

13、ter><img src=a.gif alt=老师板书 with=100 height=100>随着教育体制的改革和信息时代的到来，可能越来越多的同学己经不再适应看着教师的板书、记着笔记的学习方式，教师也开始不习惯将自己的备课笔记一遍又一遍地写在黑板上。一堂40或45 分钟的课，老师用于板书的时间不下15 分钟，也就是说真正用于教学的时间不到70 % ，这在知识信息化的21 世纪，己经捉襟见肘了；而且板书的信息含量很小，师生之问互动不强，即使很高明的教师也很难把黑底白字表现得很形象，因此难免把一些原本很感性的东西解释得比较抽象，让同学难以接受。这时，多媒体演示课件应

14、运而生，顾名思义，多媒体演示课件可习理解为利用图、文、声、像等各种多媒体素材，组成一个可以替代传统的教学板书，并能配合老师讲解、进行课堂内容演示的多媒体程序。随着多媒体技术的发展，现在的多媒体演示课件一般能实现如下几个基本功能： 1、与课堂上的讲课内容配套，将所讲内容从黑板移植到多媒体计算机中。 2、通过计算机，能把讲课内容按照课堂听讲的习惯演示出来。 3、充分发挥计算机的多媒体特性，制作并利用各种多媒体素材讲解课堂内容。 4、具备一定的交互性，使得师生间能通过课件进行交流，以达到“教学相长”的目的。 </body>

15、</html>保存后预览可见页面上多了一张图片。“<img src=a.gif alt=老师板书 with=100 height=100>”这句代码是什么意思呢？img.表示插入的是一幅图片；src=a.gif.表示插入的是本目录下的图片a.gif；alt.后面是图片的文字说明，当鼠标移到图片上面时也会显示“alt”后面的文字作为对图片的说明；alt=老师板书.当鼠标移到图片上面时也会显示“老师板书”；“with”.图片的宽度信息；“height”.图片的高度信息；第三步：调整图片的位置，使它跟文字对齐。刚才我们插入的这张图片，放在左面，而且比文字高好多，看起来真不舒服。怎么办

16、呢？我们可以在<img>尖括号里面再加入代码“align=right”,“align=right”这句代码是什么意思呢？“align”表示的是图片的位置属性，“align=right”就表示这张图片是居右的。全代码如下：<html><head><title>我的第一个网页</title><meta http-equiv=Content-Type content=text/html;charset=gb2312></head><body bgcolor=#FFFF00><center><font size=

17、6 color=31743F>教师自制教学软件的背景</center><img src=a.gif alt=老师板书 with=100 height=100 align=right>随着教育体制的改革和信息时代的到来，可能越来越多的同学己经不再适应看着教师的板书、记着笔记的学习方式，教师也开始不习惯将自己的备课笔记一遍又一遍地写在黑板上。一堂40或45分钟的课，老师用于板书的时间不下15 分钟，也就是说真正用于教学的时间不到70 % ，这在知识信息化的21 世纪，己经捉襟见肘了；而且板书的信息含量很小，师生之问互动不强，即使很高明的教师

18、也很难<img src=b.gif alt=课件教学 with=100 height=100 align=left>把黑底白字表现得很形象，因此难免把一些原本很感性的东西解释得比较抽象，让同学难以接受。这时，多媒体演示课件应运而生，顾名思义，多媒体演示课件可习理解为利用图、文、声、像等各种多媒体素材，组成一个可以替代传统的教学板书，并能配合老师讲解、进行课堂内容演示的多媒体程序。随着多媒体技术的发展，现在的多媒体演示课件一般能实现如下几个基本功能： 1、与课堂上的讲课内容配套，将所讲内容从黑板移植到多媒体计算机中。 2、通过计算机，能把讲课内容按照课堂听讲的习惯演示出来。 3、充分发挥计算机的多媒体特性，制作并利用各种多媒体素材讲解课堂内容。 4、具备一定的交互性，使得师生间能通过课件进行交流，以达到“教学相长”的目的。 </body></html>这样，这张图片到了右面，上边也跟文字对齐了。我们再在“把黑底白字表现得很形象”前面输入代码<img src=b.gif alt=课件教学 with=100 height=100 align=left>保存后预览可见页面左边多了一张图片。