第九课:插入文字和图片(完成首页设计) 演示 观看微课

童老师 8年前 2391 次查看 0 次讨论


学习目标
1. 学习在内容框中插入文字的方法;2. 学习在内容框中插入图片的方法。

本节课,将要完成首页设计。我们将在内容框中插入文字和图片,并在底部加上网页的版权信息。

一、在网页中插入文字和图片

1. 先在内容单元格中,插入1行1列的表格,设置表格的宽度为960像素,边框为0,间距和边距为10


也可以插入表格后,在选中表格,在属性面板中修改:


2. 在表格中插入一段文字,做为网页首页导语:

  我国是古诗的的国度,在我们很小的时候,妈妈就教我们:床前明月光,疑是地上霜。如今我们走进了学校的大门,在好习惯,好人生的倡导下,我们开展了丰富多彩的经典诵读活动。因此,近两年来, 同学们又背会了许多古诗,今天就让我们一起轻叩诗歌的大门,走进古诗的乐园。

然后选中文字,并设置文字大小为:36像素


3. 下载古诗主题图片“gushitupian.jpg”,并放到站点目录下的images/目录中。(图片在此页面下方下载)

点击文字的最开始位置,使用插入图片功能,选择 images/ 目录下的 gushitupian.jpg 图片。



4. 插入完成后,选中图片,设置图片的垂直边距为10,水平边距为20,并设置对齐方式为:左对齐。


5. 在文字的开始部分,如果我们想让文字缩进两格,发现敲击键盘空格是没有作用的。因为HTML语言会将无论多少个连续空格,都当作一个空格来对待。那么设置空格的方法,是:在文字开始位置输入:


   这个符号代表一个英文空格,我们需要空两个汉字位置,则需要输入四个“ "如图样式。


到这里设置插入文字和图片就完成了,可以按F12在浏览器中预览一下。

二、设置底部版权信息

1. 单击底部单元格,输入版权信息,如:”南陵县2017年教师网页课件制作培训“ 字样,完成后,选中文字,设置字体大小为:16像素,并设置对齐方式为居中对齐,单元格垂直方式为:底部。


至此,一个完整的首页就设计制作完成了,可以按F12在浏览器中预览效果。如下图:


首页制作确定了网页课件的整体风格,整体结构,其他页面都是基于首页进行再制作,所以说,首页制作是最花时间和精力的,其他页面相对就简单多了。

0

籍山中心小学及城西校区同学使用博文账号登录!