计算机网络（课件）-四川省对口招生技能操作（应会）考纲技能通

讲解人： 四川省计算机类技能考试 计算机网络 HTML与CSS网页制作 1 content 01 考核要求 02 准备工作 03 操作演示 04 学生练习 05 总结 考核要求 PART 01 3 具体的考核要求 1.能使用列表、超链接、表格、表单、多媒体等标记制作网页 2.能使用CSS渲染网页格式。 准备工作 PART 02 5 硬件设备 02 软件 计算机网络学习的环境和硬件配置 个人电脑 Dreamweaver 01 6 操作演示 PART 03 7 标记—列表 在网页中使用列表可以将相应的内容以条目的形式列举出来，进而使页面显得整齐而有序。常用的列表有：无序列表、有序列表和定义列表。 标记—列表 操作示范—列表标记的使用 点击任意位置播放视频 标记—超链接 超链接是指从一个网页指向一个目标的链接关系。超链接由链接源和链接目标两部分组成。文本或图片常用来作为超链接的链接源；链接目标可以是网页、网页上的不同位置、图像、电子邮件地址、文件，还可以是一个应用程序。 语法：<a href="链接目标URL地址">链接源</a> 说明：<a>标记中的href属性必不可少，用于指定链接目标的路径，可以是相对路径，也可以是绝对路径。 标记—超链接 操作示范—超链接标记的使用 点击任意位置播放视频 标记—表格 标记—表格 操作示范—表格标记的使用 点击任意位置播放视频 标记—多媒体 常用的图像文件格式有JPEG(*.jpg或*.jpeg)、PNG(*.png)、GIF(*.gif)、BMP(*.bmp)等。在网页中使用图像可以使内容表现形式更加丰富，能给浏览者带来强烈的视觉冲击，增加网页吸引力。 GIF支持无损压缩，最多支持256色，分为静态GIF和动态GIF;BMP可以存储单色、16色、256色、16位真彩色和32位增强型真彩色图像数据；JPEG采用有损压缩的方式，用最少的磁盘空间保存较好品质的图像文件；PNG支持无损压缩，支持透明效果，最高支持24位真彩色图像和8位灰度图像，不支持动画。 标记—多媒体 1.图像标记 语法：<img src="图像文件的地址"> 说明：<img>标记中的src属性是必不可少的，用于设置图像文件路径。这个路径可以是相对路径，也可以是绝对路径。 2.设置图像的替代文本 语法：<img src="图像文件的地址"alt="替代文本"> alt属性值可以为空值，例如：<img src="timg.jpg"alt="">,注意引号中间没有空格。 CSS渲染网页格式 CSS(Cascading Style Sheets,层叠样式表)是用于增强控制网页显示样式并能将样式信息与网页内容分离的一种标记性语言。与HTML一样，CSS不需要编译，它直接由浏览器解释执行。CSS样式通常存储在样式表中，一个或多个样式组成一个样式表，样式表将所有的样式声明统一存放、统一管理。 HTML主要用于定义网页的结构，CSS则主要用于定义网页各元素的样式，它不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页元素进行格式化。网页制作中使用CSS能更有效地定义页面样式，精确控制页面排版布局。 CSS渲染网页格式 经过css文件的渲染，网页格式得到优化 操作示范—CSS的使用 点击任意位置播放视频 学生练习 PART 04 22 学生练习 1.标题使用<h1>标签添加页面主标题“我的个人简介”。使用<ul>和<li>标签列出三项兴趣爱好。添加两个超链接，一个指向百度（外部链接），另一个跳转至页面底部的联系信息（内部锚点）。使用<table>标签创建一个两列三行的表格，展示你的学习经历（年份、学校名称）。 2.设置页面字体为Arial，标题颜色为蓝色（#0000FF）。为整个页面设置浅灰色背景色（#F0F0F0），并为所有段落添加10px内边距。给无序列表项添加鼠标悬停时的背景色变化（例如变为黄色）。在网页中插入一张个人照片，并设置其宽度为200px，高度自动调整。 23 总结 PART 05 24 课堂总结：回顾关键点，强化学习效果 25 THANKS YOUR LOGO 汇报人： 26 $$