在网页中插入图片

1、下述关于网站综合制作的说法正确的是（A ）。

（A）可以在站点设置中指定图像存放的默认位置（B）在DreamWaver中可以完成页面切片的工作（C）一般情况下,插入图像是在"标准"模式下而非"扩展"模式（D）自由延伸设置宽度100%是指该行的宽度维持不变2、正确的设置自由延伸的表格的方法是将表格的宽度和高度设置为（B ）。

（A）100（B）100%（C）100px（D）all3、（A ）是网页与网页之间联系的纽带，也是网页的重要特色。

（A）导航条（B）表格（C）框架（D）超链接4、HX标记可以有对齐属性，不属于该标记对齐属性的是（D ）。

（A）LEFT（B）CENTER（C）RIGHT（D）TOP5、HTML中表示文字粗体的标记除了使用〈strong〉外，还可以使用（B ）。

（A）〈a〉（B）〈b〉（C）〈TD〉（D）〈Font〉6、在网页中设置字号大小的标签是？（B ）（A）〈BIG〉（B）〈FONT〉（C）〈P〉（D）〈OL〉7、关于网页中的换行，说法错误的是（D ）。

（A）可以使用〈br〉标签换行（B）可以使用〈p〉标签换行（C）使用〈br〉标签换行，行与行之间没有间隔；使用〈p〉标签换行，两行之间会空一行（D）可以直接在HTML代码中按下回车键换行，网页中的内容也会换行8、下述关于CSS的说法错误的是（B ）。

（A）CSS可以设置图文混排的效果（B）CSS可以设置文字的行为（C）CSS可以设置图片的边框（D）CSS可以设置背景图像仅在纵向重复9、代码：.st1215{font-family:"宋体";font-size:12px;line-height:1.5;}使用了“类”来设置文字样式，在页面中引用该样式的命令语句为（A ）。

（A）class=st1215（B）class=.st1215（C）id=st1215（D）id=#st121510、不属于CSS控制页面的方法是（C ）。

1、（A ）是网页与网页之间联系的纽带，也是网页的重要特色。

（A）导航条（B）表格（C）框架（D）超链接2、绘制网站页面，可使用的绘图工具有（D ）。

（A）Authorware（B）Visual Basic（C）Flash（D）Fireworks3、在编辑完首页之后，会保存首页文件，下列哪个不是首页文件常用的文件名（D ）。

（A）index.asp（B）default.htm（C）index.php（D）index1.htm4、在HTML中，〈pre〉的作用是（B ）。

（A）标题标记（B）预排版标记（C）转行标记（D）文字效果标记5、在HTML中，〈pre〉的作用是（A ）。

（A）标题标记（B）预排版标记（C）转行标记（D）文字效果标记6、制作无序号列表应该使用标签（A ）。

（A）〈UL〉和〈/UL〉（B）〈OL〉和〈/OL〉（C）〈ML〉和〈/ML〉（D）〈br〉7、在网页中添加换行符应用以下哪个按键？（D ）（A）【Enter】（B）【Ctrl】+【Enter】（C）【Alt】+【Enter】（D）【Shift】+【Enter】8、下列各项中不是CSS样式表优点的是（B ）。

（A）CSS对于设计者来说是一种简单,灵活,易学的工具,能使任何浏览器都听从指令,知道该如何显示元素及其内容（B）CSS可以用来在浏览器的客户端进行程序编制,从而控制浏览器等对象操作,创建出丰富的动态效果（C）一个样式表可以用于多个页面,甚至整个站点,因此具有更好的易用性和扩展性（D）使用CSS样式表定义整个站点,可以大大简化网站建设,减少设计者的工作量9、有关CSS，下面说法错误的是（C ）。

（A）CSS，中文译为层叠样式表（B）是一种标签式语言（C）相同的CSS效果，在各种不同的浏览器上，显示效果是一样的（D）同一个CSS文件，可以应用到整个网站的所有页面中10、在DreamWeaver中，可以在“CSS样式”面板中管理CSS 样式并应用到网页中。

第5讲图像的操作（一）1.1教学目标：◆知识目标1.认识图像，掌握在页面中插入图像的方法2.掌握图像各属性的作用和交换图像的设置。

◆技能目标1.能够根据页面显示效果在适当位置插入图像元素。

◆品质目标培养学生认真细致、踏实进取的精神1.2教学重点：2.掌握图像各属性的作用和交换图像的设置。

1.3 教学难点交换图像的设置。

1.4教学方法：讲练结合，任务驱动、分子任务操练1.5课时安排：2课时1.6教学对象分析：这个班学生具有基本专业技能，不仅仅是要教会他们方法，最重要的是教会他们的规范的动手能力与各种事件多方法的灵活处理能力，在保证全班同学教学进度一致的情况上，培养学生较好的专业基础与创新创作意识。

1.7教学过程：一、激趣导入，揭示课题前一章节把Dreamweaver MX的工作环境做了一个详细介绍，相信同学们对网页制作软件的界面有了一个清晰的认识，万事开头难，一个好的站点不仅有全局规划，而且一个功能强大的网站，需要多方面知识的积累，首先找一个已经做得比较好的网站，把整个链接过程演示给学生，让他们感受到网站其实做起来也不难，只要用心就可以，关键是主线要清晰。

二、使用图像图像和文字是网页中最重要的两个元素。

一个高质量的网页是离不开图像的。

制作精良的图像可以大大增强网页的美观性，令网页更加生动多彩。

在页面中如何用漂亮的图像来吸引人们的视线是每个网站都需要面对的问题。

一幅好的图片，胜过千言万语，反映在网页上也是如此。

在这里“好的”这个词包含了三方面的含义：一是指合适的，用一幅毫不相干的图像只会起到画蛇添足的作用；二是指正确的，用一个文件量很大的图像或者格式错误的图像，只会让浏览者对你的网页火冒三丈；三是指漂亮的。

0.1认识图像要在文档中正确使用图像，首先要了解一些Internet相关的图像知识。

由于图像在磁盘中的压缩方式和存储方式的不同，加上许多图像处理软件又有自己专门的格式，所以图像的标准有很多种。

目前在Internet上最为常见的图像包括JPG、JPEG、GIF和PNG等几种，在网页上使用的图像一般有JPEG、GIF、PNG等。

第四课在网页中插入表格与图片一、教学目标分析课堂标准让学生掌握利用表格来布局网页信息的方法。

掌握在网页中插入图形图像。

知识与技能●学会插入表格●学会调整表格●学会插入图片●学会调整图片●学会插入水平线及使用列表。

过程与方法采用任务驱动的方法，自主学习，再通过分组探究，技能竞赛，协作学习，让学生在轻松的氛围下学习，具有使用搜索引擎技巧的能力。

情感态度与价值观1、培养学生协作学习、互相帮助的精神2、培养学生的探索精神和主动学习的习惯。

四、教学重点、难点与解决措施重点：插入与调整表格技巧，插入图片的技巧难点：插入与调整表格的技巧解决措施：让学生通过浏览网页，并下载网上利用表格定位的网页，通过网页制作工具，打开所下载的网页，并将其中的图片删除来达到认识表格的目的，然后利用竞赛的活动，让学生们参与其中，由此来引导学生对网页设计问题的思考，并逐步掌握网页表格布局设计的技巧，也就是掌握网页设计的技巧。

五、教学设计思路：本课以学生为主体，老师为主导的教学模式开展的，以学生的积极探索，小组协作学习、自主学习等学习模式通过反复练习总结，知识水平实现螺旋式上升，最终实现知识的意义建构，并考虑到学生的知识层次有所不同，在拓展学习方面特意设置不同程度的学习内容，满足各层次学生的需要。

六、依据的理论在做中学、引导发现式教学七、教学策略及选用媒体基于教学内容的要求以及学生的特征，本教学设计的教学以学生自主学习为主，老师在课堂中起到主导作用的教学模式开展，通过探究学习寻找解决问题的方法，并以竞赛的形式，让学生在反复的操作中得到搜索的经验，老师引导学生总结经验，把感性认识上升到理发认识。

在拓展知识部分，学生能根据自己的水平选择学习知识的分量，让不同层次的学生都可以在课堂中尽量掌握自己要学的知识，而且以小组的形式开展，有助于同学间互相协作，共同达到知识的意义建构。

使用网络教室平台进行屏幕控制及转播，学生机能接入互联网。

八、教学过程第1课时表格可以很好地起到定位作用，这节课里我们将学习在网页中插入表格与图片。

《在网页中插入图片》教学设计作者：朱琳琳来源：《小学科学·教师版》2011年第11期【设计理念】学习总是与一定的情境相联系的，切合教学内容的情景创设，可以为学生的自主探究提供一个良好的空间，又可以激发学生自主探究的动力。

本课主要采用“任务驱动”教学法来实施教学。

【学情分析】学生已经学会了新建网页，在网页中输入文字。

学生就有“为网页添加图片信息”的欲望，结合因特网知识让学生为自己创建的网页添加图片的信息，添加图片的技能学生已经在word文字处理软件中学习过，因此本节课知识，学生可以自主学习。

【教学目标】1、知识目标在网页中插入图片。

对图片进行编辑。

设置网页背景图片。

2、能力目标：利用插入图片知识，培养学生的图文并茂整体布局网页的综合信息素养能力。

3、情感目标：通过作品展示和评价是让学生体验成功的喜悦，激发学生的创造热情。

【教学重点】在网页中插入图片。

【教学难点】设置网页的背景图片。

【教学方法】情景导入法、任务驱动法【课前准备】FrotntPage2000软件多媒体教学网络系统【教学过程】一、创设情景激发兴趣【教师活动]利用多媒体教学广播系统展示两组图片(“自然美图片”和“灾难图片”)。

两组截然不同的图片，看过后，有什么感受呢?学生：学生欣赏两组图片并谈感受。

教师：同学们都知道，地球是我们的“生命之舟”。

可是我们人类却因为个人的利益，人为的破坏她，导致了各种灾难的发生。

环境污染是我们人类面临的一个严峻问题。

所以同学们我们应该带头保护环境，来宣传爱护环境的重要性。

学生倾听受教育。

教学意图：通过欣赏两组对比图片，宣传环境保护的重要性，对学生进行情感教育，来激发学生学习的兴趣。

二、导入主题欣赏范作教师：同学们想一想，我们可以通过什么途径来宣传爱护环境呢?学生：写作文、画画、制作手抄报、做一个网页……教师：同学们的办法可真多啊!我们可以用这个学期所学的电脑知道来制作网页，宣传“爱护环境”。

教师：回忆：组成网页的两大主要元素是什么?学生：文字和图片。

img创建方法在网页设计和开发中，img标签是用来插入图片的最常用标签之一。

通过img标签，我们可以在网页中展示各种图片，丰富网页的内容和视觉效果。

本文将介绍img标签的创建方法和一些常用的属性，以帮助读者更好地使用img标签。

一、img标签的创建方法在HTML中，要创建一个img标签，只需要使用"img"这个标签名即可。

img标签是一个自闭合标签，不需要闭合标签。

下面是一个基本的img标签的创建方法的示例：<img src="图片地址" alt="图片描述">其中，src属性用于指定图片的路径或URL地址。

在实际使用时，我们可以将图片放在本地文件夹中，也可以使用网络上的图片；alt 属性用于指定图片的替代文本，当图片无法加载时，将显示替代文本。

二、img标签的常用属性除了src和alt属性外，img标签还有一些常用的属性，可以用来控制图片的显示效果和行为。

1. width和height属性：用于指定图片的宽度和高度。

可以使用像素值或百分比来设置。

2. title属性：用于指定鼠标悬停在图片上时显示的文本。

3. align属性：用于控制图片在文本中的对齐方式。

常用的取值有left、right和center。

4. border属性：用于设置图片的边框宽度。

5. usemap属性：用于指定一个客户端图像映射的名称。

6. ismap属性：用于指定图片是否是一个服务器端图像映射。

三、使用示例下面是一个使用img标签来展示图片的示例：<h1>这是一个图片示例</h1><p>下面是一个使用img标签来插入图片的示例：</p><img src="images/picture.jpg" alt="图片描述" width="300" height="200"><p>这是一张美丽的风景图片。

职称计算机Dreamwaver考点：插入图像职称计算机Dreamwaver考点：插入图像导语：目前互联网上支持的图像格式主要有GIF、JPEG和PNG。

其中使用最为广泛的是GIF和JPEG。

那么在Dreamwaver的使用中我们要如何插入图像呢?一起来看看吧。

1、插入图像在制作网页时，先构想好网页布局，在图像处理软件中将需要插入的图片进行处理，然后存放在站点根目录下的文件夹里。

插图图像时，将光标放置在文档窗口需要插入图像的位置，然后鼠标单击常用插入栏的“图像”按钮。

弹出的“选择图像源文件”对话框，选择img/001.jpg，单击“确定”按钮就把图像001.jpg插入到了网页中。

注意：如果我们在插入图片的时候，没有将图片保存在站点根目录下，会弹出下图所示的对话框，提醒我们要把图片保存在站点内部，这时单击“是”按钮，然后选择本地站点的路径将图片保存，图像也可以插入到网页中。

2、设置图像属性选中图像后，在属性面板中显示出了图像的属性，如下如所示。

在属性面板的左上角，显示当前图像的缩略图，同时显示图像的大小。

在缩略图右侧有一个文本框，在其中可以输入图像标记的名称。

图像的大小是可以改变的`，但是在DW里更改是极不好的习惯，如果我们的电脑安装了FW软件，单击属性面板的“编辑”旁边的，即可启动FW对图像进行缩放等处理。

当图像的大小改变时，属性栏中“宽”和“高”的数值会以粗体显示，并在旁边出现一个弧形箭头，单击它可以恢复图像的原始大小。

“水平边距”和“垂直边距”文本框用来设置图像左右和上下与其它页面元素的距离。

“边框”文本框时用来设置图像边框的宽度，默认的边框宽度为0。

“替代”文本框用来设置图像的替代文本，可以输入一段文字，当图像无法显示时，将显示这段文字。

单击属性面板中的对齐按钮，可以分别将图像设置成浏览器居左对齐、居中对齐、居右对齐。

在属性面板中，“对齐”下拉列表框时设置图像与文本的相互对齐方式，共有10个选项。