网页设计基础-文本格式与超链接
《网页设计基础》PPT课件
1.4 建立网站的基本流程
图1-2所示的是一个网站的完整制作流程.
确定主题策划与准备来自收集资料与素材规划网站结构
图
-
1
设计网页版式
2
确定网站结构
网
站
制作阶段
制作网页元素
的
制
插入元件与排版
作 流
上传网站
程
后期工作
维护与更新
1.4.1 确定主题
网站的主题也就是网站的题材, 是网站设计首先遇到的问题.
〔2〕利用Fireworks修改图像非常方便.
〔3〕Fireworks无需借助其他工具就可 以完成将一个图像转化为网页元素的全过程.
〔4〕Fireworks具有文件导出功能.
1.3.2 Flash
Flash是Macromedia公司开发 的用于矢量图形编辑和动画创作的 专业软件,它是一种交互式动画设 计工具,用它可以将音乐、声效、 动画以及富有新意的界面融合在一 起,以制作出高品质的网页动态效 果.
网站的定位要小,内容要精.
网站的题材最好选自己擅长或 者喜爱的内容.
网站名称,是网站设计的一部 分,而且是一个关键的要素,和现实 生活中一样,网站名称是否正气、
1.4.2 搜集资料 1.4.3 网站的整体规划
进行网站的整体规划也就是组 织网站的内容并设计其结构. 1.4.4 网页设计与制作
1．静态网页的设计与制 作
Dreamweaver是 Macromedia公司推出的一款大 众化的网页制作软件,它具有可 视化编辑界面,用户不必编写复 杂的HTML源代码就可以生成跨 平台、跨浏览器的网页,不仅适 合于专业网页编辑人员的需要, 同时也容易被业余网页制作人员 所掌握.
1.2.3 FrontPage
网页设计超链接三个知识点
A、超链接<a>标签<a></a>是对标签，里面必须有属性<a href=“…”></a>，href的全称是h yptertext ref erence（超文本索引），其值可以是网页文件（.html）、图片（.jpeg, .gif, .png）、多媒体（.mp3, .mp4）、可携带文档格式（.pdf）以及一些其他类型的文档（.doc, .ppt, .xls, .rar, .zip等），前面网页文件、图片、多媒体与可携带文档都可以在浏览器中直接打开，后面的其他文档则会通过下载文件的形式下载下来。
B、用<a>标签来做“锚记链接”的步骤：1、首先你需要有一个“导航”，导航我们一般用列表标签来做，对里面的列表添加a标签，不同的是这个a标签的href里是#和一个名字，#是当前页面的意思，也就是定位到当前页面的某个位置，比如说：<ul><a href=“#1”><li>…</li></a><li>…</li><li>…</li></ul>2、定义一个超链接的位置，作为空位置可以用p标签或者其他常用标签来代替，该超链接需要添加一个name属性，比如说：（这里不需要#咯）<a name=“1> <p></p>这样就实现了按ul中的a标签，页面自动定义到网页中某个位置的作用。
C、音频与视频标签这两个都是对标签，音频audio，视频video，常用属性有src（source来源）, autoplay（自动播放）, controls（控件）, loop（循环播放），一般写作：<audio src=“…”controls=“controls”autoplay=“autoplay”loop=“loop”></audio>这里只有src是必须的，其他都可以去掉，根据自己需要来写，例如不要显示控件就把controls=“controls”去掉。
网页制作基础知识
4．制作工具的选择
可使用FrontPage、DreamWeaver等网页制作软件。在本案例中，将使用 DreamWeaver MX进行“网页制作学习园地”网站的创建。
1.2 理论知识
1.2.1 HTML语言
在Web的发展历史中，HTML技术是优秀而核心的Web技术之一。目前计算机上包含互 联网在内的大部分应用程序在交互操作上的核心原理都来自于HTML的链接设计思想。
<h#>...</h#> <b>...</b> <i>...</i> <u>...</u> <sup>...</sup> <sub>...</sub> <tt>...</tt> <cite>...</cite>
<em>...</em>
<address>...</address> <strong>...</strong> <pre>...</pre>
<font size=" ">
<font face=" ">
<font color=" ">
设置文字的颜色
2 . 文本样式标记
文本样式标记用于设置网页中文字格式化为特殊的形式，如加粗、倾斜等。
文本样式标记如下表：
标 记 说 明
定义标题级别，黑体字显示。"#"=1～6。<h1>显示的字号最大、<h6>最小。 设置粗体字 设置斜体字 设置下划线 设置文本为上标格式 设置文本为下标格式 设置打字机风格字体的文本 以引用或参考的形式格式化文本，通常显示为斜体。
网页设计基础-1
网页设计中的ppi设置
基础篇Biblioteka 1.2.2 浏览器浏览器是指可以显示网页服务器或文件系统的HMTL内容，并让用户与这些文件 交互的一种软件。常用的浏览器有Chrome,IE，Safari，火狐，UC等。用户可以 根据自己的喜好及浏览器特性来选择使用。
从左至右分别是Chrome,IE，Safari，火狐，UC浏览器
IE浏览器比Chrome展示的内容略少，信息显示的更大；然后，细节上IE 浏览器下的字体较大且颜色为黑色、蓝色，广告区域的文字信息置于图 片之下，菜单栏高度较高；再然后，IE浏览器头部的高度略要低于 Chrome浏览器，这样会导致在浏览器容器内看到的一屏信息的高度会
更高。
不同浏览器的头部高度不一
基础篇
基础篇
3.增值服务收费 增值服务收费模式是指基础服务功能免费，高级服务功能收费。这种模式常见于一些社交 网站的会员制度及游戏网站中的道具。如在QQ本身免费，但是你要想享受更多服务就得付费升 级会员。
基础篇
4.直销模式 直销模式是利用互联网平台本身来卖自营商品，这种模式实际上就 是减少中间环节，把商品直接销售到用户手中。典型方式如当当网的自
基础篇
1.1.1 网站的基本概念
网页是以提供人机交流便利为目的的中间媒体。它是超文本标 记的语言格式（.html或.htm）,是一种可以在WWW（World Wide Web的缩写）网上传输，经由网址（URL）被浏览器识别并
翻译成页面显示出来的文件。
网站是由多个网页用超链接的方式组成的有机整体。网站被储 存在指定的网站空间（服务器或虚拟主机），通过域名（网址）进 行访问。一个网站至少包含一个网页，上不封顶。
聚美优品网，专注于女性化妆品正品折扣网店，具有强烈的产品特色和专业性。在 设计电子商务类网站时，要充分考虑到网站有高质量且丰富的内容，更新及时，网站
第5章 超链接
5.2.3 外部链接
外部链接指跳转到当前网站外部，与其它 网站中页面或其它元素之间的链接关系。 外部链接的URL地址一般要用绝对路径。
<a href=“http://网址”>
5.2.3 外部链接
表5-2 常用的URL格式
服 务 URL格式
ftp://192.168.0.1 news:// mailto:abc@
5.2.1 设置超链接路径
3.根路径
是指从站点的根文件夹到文档的路径。 站点根目录相对路径以一个正斜杠开始，该正 斜杠表示站点根文件夹。 用于网站的内部链接，不建议使用。
当一个站点放置在几个服务器上或一个服务器 上放置了几个站点时，可以使用根路径。
5.2.1 设置超链接路径
链接本地机器上的文件时，应该使用相对路 径还是绝对路径？ 在绝大多数情况下使用相对路径比较好，例如， 用绝对路径定义了链接，当把文件夹改名或者 移动之后，那么所有的链接都要失败，这样就 必须对你的所有html文件的链接进行重新编排， 而一旦将此文件夹移到网络服务器上时，需要 重新改动的地方就更多了，那是一件很麻烦的 事情。而使用相对路径，不仅在本地机器环境 下适合，就是上传到网络或其他系统下也不需 要进行多少更改就能准确链接。
5.2.1 设置超链接路径
所需要的所有信息。 绝对路径是指链接文件的完整路径，包括完整 的协议名称、主机名称、文件夹名称和文件名 称。
用于网站的外部链接。
如果要链接站点外远程服务器上的网页或图像 等文件，必须使用绝对路径进行链接，即使站 点移动至其他位置也不会出现断链现象。
带下划线的蓝色文本
5.2.1 设置超链接路径
每一个文件都有自己的存放位置和路径， 理解一个文件到要链接的那个文件之间的 路径关系是创建链接的根本。
HTML（超文本标记语言）是制作网页的基础HTML标记是HTML...
第1章HTML基础HTML(超文本标记语言)是制作网页的基础。
HTML标记是HTML的核心与基础，用于修饰、设置HTML文件的内容及格式。
一个HTML文件中包含了所有将显示在网页上的文字信息。
其中也包括对浏览器的一些指示，如文字应放置在何处，显示模式如何等。
如果还有一些图片、动画、声音或是任何其他形式的资源，HTML文件也会告诉浏览器到哪里去查找它们，以及它们将放置在网页中的什么位置。
教学目标通过对本章的学习，读者应了解和掌握HTML的各种标记和语法，并能够使用HTML 设计简单的静态网页。
教学重点与难点●使用HTML设计静态网页●编辑网页文本格式●创建超链接●使用表格●使用列表1.1 网页基础知识Internet是从Interconnected Networks延伸而来的，是跨国界的网络。
Internet把世界各地数以千万计的计算机和传输线路连接在一起构成一个网络。
通过它可以交换信息、共享资源，并以此为基础实现各种计算机通信应用项目。
在Internet中，网页是它的重要组成部分，本节首先介绍一些与网页相关的名词和概念。
1.1.1 万维网——WWWWWW(World Wide Web)即环球信息网，也可以称为Web，中文名字为“万维网”。
用户在使用浏览器来访问Web的过程中，无须关心一些技术性的细节即可得到丰富的信息资料。
WWW 是Internet上发展最快和目前使用最广泛的一种服务。
ASP动态网站开发教程• 2 •简单的说，WWW是漫游Internet网的工具，它把Internet上不同地点的相关信息聚集起来，通过WWW浏览器(比如IE，Internet Explorer)检索，无论用户所需的信息在什么地方，只要浏览器为用户检索到之后，就可以将这些信息(文字、图片、动画、声音等)“提取”到用户的计算机屏幕上。
1.1.2 超文本传输协议——HTTPHTTP(HyperText Transfer Protocol)即超文本传输协议，它是WWW服务器上使用的最主要协议。
网页-实验目录2
实训一站点的资源管理【实训目标】1、掌握站点的创建方法2、掌握站点的上传方法3、掌握空间站点的管理方法【实训内容】1、站点的创建、2、申请网上个人主页空间3、上传、下载站点4、个人空间管理实训二HTML基础与文本格式【实训目标】1、了解HTML的作用及其写法和规则2、掌握常见的HTML语句3、会在代码窗口编写简单的html语句，并输出生成页面【实训内容】用记事本或者是通过Dreamweaver代码窗口编写代码完成以下实训：1．用HTML编写一个简单的基本页面2．创建一个使用图像作为背景图案的网页3．创建一个页面，对文本进行设置4. 插入背景音乐实验三表格与超链接【实训目标】1、会利用表格对网页进行布局2、理解和掌握超链接的含义3、掌握几种超链接的创建方法4、掌握热区的创建和使用方法【实训内容】运用表格的嵌套等技术对所给的图片和文字进行定位。
创建网页文本链接；创建网页图片链接；创建电子邮件链接；创建脚本链接；创建锚点链接；给链接添加提示及管理链接。
实训四表单【实训目标】1、掌握表单项目的创建方法【实训内容】1、制作一个用户注册页面实训五框架【实训目标】会利用框架网页进行布局掌握框架网页的创建方法；掌握保存方法；掌握框架网页的编辑方法。
【实训内容】1、制作一个框架集网页，要求整个框架集包含3个页面2、制作一个能在页面内指定位置打开网页的页面实训六层与行为【实训目标】1、掌握插入层与绘制层的方法3、掌握层与行为特效的使用方法【实训内容】1、绘制层2、利用行为特效控制层的显示与隐藏效果实训七Fireworks 实例制作【实训目标】1、熟练认识与掌握fireworks矢量工具的使用2、掌握矢量图形与位图的区别3、理解和掌握路径与填充的特点4、掌握路径组合的特点和方式【实训内容】1、十字梅花按钮效果2、文字曲线动画3、Loading实例制作4、冬之韵逐字动画《网页设计》综合作业一、实训目的1.了解各类网站的制作方法。
网页设计实用教程 第4章 超链接.
(6) 一个图像热区链接创建完成，单击【保存】按钮，按 F12按钮预览网页。
4.2.5
创建锚链接
超链接除了可以链接到文件外，还可以链接到本页中的 任意位置，这种链接方式称为“锚链接”。当一个网页的主 题或文字较多时，为了方便用户浏览，可以在网页内的某些 分项内容上建立多个标记点，将超链接指定到这些标记点上， 使用户能快速找到要阅读的内容。我们将这些标记点称为锚 点（Anchor）
图4-3 电子邮件链接对话框
4.2.3
创建E-mail链接
(3) 对话框中“文本”指在网页上显示的文本， “ E-mail”指需要链接到的邮箱地址，这里输入 “wysj@” ，单击【确定】按钮完成Email链接的设置。 也可以在属性面板的“链接”文本框中输入 “mailto:”和邮箱地址，这里是“mailto: wysj@”。 (4) 一个E-mail链接创建完成，单击【保存】按钮， 按 F12按钮预览网页。
4.2典例剖析—信息导航列表
本节将通过建立一个信息导航网页的实例来讲解超链接的使 用。本节操作任务： （1）在“Mystuhome”下建立文件夹“超链接”，在 “超链 接”文件夹下建立网页“index.html”和文件夹“image” （2）在网页中创建链接。 （3）在网页中创建E-mail链接。 （4）在网页中制作图像映射，设置图像热点的超链接。
4.4
习 题
三、上机实践 1. 在超链接文件夹下创建“名站收藏..html”网页文档，在网页 中列举自己经常访问的网站名称，为他们建立到网站网址的 超链接。 2. 在超链接文件夹下创建“相册..html”网页文档，在网页中插 入图片，在图片上建立热区图像链接。 3. 为网页“相册.html”建立到底端和到顶端的锚链接。
《网页设计与制作基础》实验指导
实验一网页的认识实验目的1、掌握利用Internet进行信息游览、搜索，下载网页、图片、文字和文件；2、利用记事本来编辑HTML文档并浏览；3、熟悉HTML基本标记的使用。
实验环境WindowsXP操作系统，内部组成局域网，外连Internet互联网。
实验重点及难点◆熟悉HTML的结构、语法。
◆熟悉HTML基本标记的使用。
实验内容1、从网上（如网页制作大宝库等）下载网页制作时需要的小图片、动画及flash等网页制作素材。
2、收集你认为比较好的网页并从网页主题、网页内容、结构布局、色彩搭配等方面来分析网页。
3、通过浏览新浪网站主页分析其网页基本元素，查看其源代码，收藏到收藏夹中，将其设为主页。
4、制作一个简单的网页sy1-1.html，用记事本编辑，网页标题为“熟悉HTML文档的结构”，内容为司空曙的《江村即事》，如下图所示。
5、通过附录1的练习熟悉HTML基本标记的使用。
（可参考第二章内容）实验二 Dreamweaver基本操作（一）实验目的1、熟悉Dreamweaver的工作环境并了解本地站点的建设和管理；2、熟悉网页文件的基本操作；3、熟练掌握在网页文件中文本、图像、超链接的添加和设置。
实验环境WindowsXP操作系统，Dreamweaver CS3软件，内部组成局域网，外连Internet互联网。
实验重点及难点◆文字的插入及设置。
◆图像的插入及设置。
◆各种超链接的创建。
实验内容1、使用Dreamweaver建立一个本地站点并命名为“Dreamweaver基本操作”，包含以下几个文件和文件夹：图片文件夹（images）；音乐文件夹（sound）等。
2、在站点“Dreamweaver基本操作”中新建一个名为sy2-1.html的网页文件，从提供的网页原始素材中把相关文字复制到该网页文件中，并进行适当的文字设置，结果如下图所示。
3、在站点“Dreamweaver基本操作”中对网页sy2-1.html按如下要求进行编辑并另存为sy2-2.html，效果如图所示。
网页设计与制作项目7超链接
鼠标指向导航图像
7.2 网页制作
步骤 10 重复同样的操作，插入鼠标经过图像，在 图像名称的文本输入框中输入“酒店机票”，用与设置 “首页”相同的方法选择所需要的图像，【插入鼠标经过 图像】对话框中的参数设置如图所示。
【插入鼠标经过图像】对话框参数设置
7.2 网页制作
7.2.2 创建文本与图片超链接 步骤1 创建文本超级链接。在【属性】面板上单击 “页面属性”按钮 ，设置文本链接的属性，参数设置如 图所示。 步骤2 在“目的地”页面中选择文本“预订酒店”， 如图所示；在【属性】面板上单击“链接（L）”右侧的 “浏览文件”按钮 。
步骤7 单击“预览”按钮 ，当鼠标指向 文本“黄山”图片时，单击即可跳转到“黄山” 页面上。 步骤8 按照相同的操作，可以完成图片 “苏州园林”、“桂林”的超级链接。
7.2 网页制作
7.2.3 创建图像映像超链接 步骤1 在“目的地”页面上单击“地图”图片，在 【属性】面板单击“矩形热点工具”按钮 ，在地图上的 “北京”处绘制“矩形”，如图所示。 步骤2 在【属性】面板上单击“链接（L）”右侧的 “浏览文件”按钮 ，或直接输入超级链接的目标文件名， 如图所示。
“目的地”页面效果
7.2 网页制作
7.2.1 设置导航条超链接 步骤1 启动Dreamweaver CS6后，在letuweb 站点中创建新文档，命名为“destination.html”。 步骤2 在destination文档中绘制表格布局页面，输 入相应的文字、选择图像等素材，插入页面顶部LOGO及其 他元素，如图所示。
7.2 网页制作
步骤3 在表格的第3行定位光标，执行【插入】| 【图像对象】|【鼠标经过图像】菜单命令，弹出【插 入鼠标经过图像】对话框，如图所示。
第一课时网页设计基础知识
邹城高级职业技术学校
Dreamweaver CS5网页制作
基础知识
由于网络中包含的计算机有可能不一样多，根据网络规模的大小和 其它因素，把32位地址信息设成五种类别，分别对应于A类、B类、C类、 D类、E类IP地址。
由于计算机网络等飞速发展，IP地址逐渐不够用了（实际上只有大约43亿个地 址），实际情况是在2011年2月3日地址分配完毕 ，为了扩大地址空间，拟通过 IPv6重新定义地址空间。IPv6采用128位地址长度。在IPv6的设计过程中除了一 劳永逸地解决了地址短缺问题以外，还考虑了在IPv4（原来等32位）中解决不 好的其它问题。IPv6几乎可以不受限制地提供地址。按保守方法估算IPv6实际可 分配的地址，整个地球的每平方米面积上仍可分配1000多个地址。
根据网站的商业目的分类：营利型网站（行业网站、论坛）、非营利性型网站（企业 网站、政府网站、教育网站）
邹城高级职业技术学校
Dreamweaver CS5网页制作
基础知识
C、网页网站区别 网页是一个文件，一个页面。 网站是一个站点，是由多个网页组成，浏览一个网站的其他网页都 是通过超级链接的方式逐个浏览。
所谓动态就是指，当你每一次上网时，电信会随机给你分配 一个IP地址，静态就是每次上网都用一个地址。
那些能够显示你的IP地址的浏览器显示的一般都是不正确的例如：家里上网。 ADSL也好。拨号也好都是动态的，是电信随机分配给你的。而且有时间性。重启 ADSL的话就会变。 单位对外的一般使用的是静态独立IP地址（互联网内唯一，我们一般称为”大 号“）
邹城高级职业技术学校 齐刘锋
Dreamweaver CS5网页制作
基础知识
第一课时 基础知识
邹城高级职业技术学校
网页的基础知识
网页基本知识内容！一、网页设计基础（一）什么是主页？Internet快速发展，网民人数激增，能在网上拥有自己的主页是网民的心愿。
在网络中有一种配置较高，24小时开机的计算机，之间连接在internet上的服务器。
利用浏览器，通过internet可以直接查看硬盘（服务器）上的文件，这就是我们讲的网页。
很多网页合起来就构成了主页。
（二）主页空间及免费服务要做主页首先要在internet上找一个服务器空间放置主页。
大的网站可以给你提供30M至100 M的免费主页空间让你使用。
因为是免费的，服务功能少一些。
你要享受更好的服务，可以申请虚拟主机，但这是要收费的。
申请到主页空间后，会得到一个域名，就是你的主页地址，在浏览器地址栏输入这个网址就可以浏览你的主页了。
如果网址名太长不好记，还可以申请一个新的域名。
域名有免费和收费两种，免费的域名，注册一下就可以了；收费的域名要到指定的机构办理手续。
国外域名可以自由申请，一个域名一年约十几元钱。
在internet上还有免费的计数器和聊天室，都可以用到你的网页中去。
（三）网页实际是文本文件网页是用文本文件组成的，扩展名是htm或html。
最初用html（超文本标记语言），现在扩展为有HTML、CSS、JAVAｓｃｒｉｐｔ组成的DHRML，就是常说的“动态网页”。
网页是纯文本文件，可以用文本编辑软件来编辑，记事本是最简单的网页编辑工具了，但功能太简单。
Ultraedit是具有很强功能的文本编辑软件，专为网页编辑提供了很强的功能。
（四）所见即所得的网页制作工具用文本编辑软件做网页必须会HTML语言，所见即所得的网页制作工具，和WORD排版差不多，你只要将文本、图形摆到网页中，网页会自动生成HTML代码。
Frontpage是微软公司出品的网页制作工具，和WORD、IE结合得非常好，简单易用、易上手，是初学者比较好的选择，但兼容性差一些，制作的网页不支持Netscape等其他浏览器，对复杂的动态网页的设计能力有限。
网页设计与制作 项目 5使用超链接
注意：在创建E-mail链接时，mailto:和 “@”是必不可少的
5.2.5 创建空链接
空链接实际上是一个未指派目标的链接，利用 空链接可以激活网页上的对象或文本。
（1）打开HTMI，选择文字或图片
页
Javascript：window.close()：关闭窗口
任务2 管理超链接
5.3.1 链接检查器的使用
在DreamweaverCS4中可以使用链接检查器来 管理当前站点的超链接，帮助站点制作者检查站 点的链接是否有效，统计有效连接、无效链接、 断开连接和外部链接的个数，修改断开或无效的 链接。
2.图像地图
图像地图，也称为图像热区、图像热点，在“属 性”面板上的矩形、圆形和多边形热点工具建立 需要的热点区域
5.2.3 创建锚点连接
1.创建目标在本页上的锚点链接
（1）打开HTML，光标定位在热字前面， “插入”——“命名锚记”命令，或者在“常 用”选项卡中单击“命名锚记”按钮
（2）在“锚记名称”文本框中输入锚记的 名称abc，单击“确定
（2）在“属性”面板“链接”下拉列表中输入 “javascript:;”或输入“#”就可以了
5.2.6 创建文件下载链接
选择需要创建文件下载链接的源文本，在 “属性”面板“链接”下拉列表输入目标文件的 URL
5.2.7 创建脚本链接
网站中的超链接不但可以实现网页页面之间的跳转， 还可以直接调用Javascript代码，这种超链接就成为脚本 链接或Javascript链接。 （1）选定文字或图片，在“属性”面板“链接”下拉列表 中输入“Javascript ：”，然后输入一些Javascript代码 或函数调用即可
《网页制作基础教程》习题参考答案
第1章习题参考答案一、思考题1．答：因特网：即Internet，通常称为互联网或国际互联网。
ISP：因特网服务提供者。
ICP：因特网内容提供者。
WWW：World Wide Web的简称，有时也简称为Web，对应的中文名称为万维网，是因特网提供的一种服务。
IP地址：在因特网中，每一台主机都必须有一个IP地址。
IP地址由4个字节（32位二进制数）组成。
域名：用文字描述来代替IP地址，解决IP地址难以记忆的问题。
URL：统一资源定位器，是表示Internet上信息资源地址的统一格式。
超文本：是指包含指向其他Web页的超连接（Hyper link）文本格式。
超链接是指内嵌了Web地址（即网页的URL）的文字或图形。
网页：网页（Web Page）也称为Web页面，通常是使用HTML语言编写成的。
一个Web页面对应一个HTML文件，也可能还包括与该HTML文件相关的若干个图片文件、其他多媒体文件和脚本文件等。
网站：网站（Web Site）是由Web服务器上的一组相关的网页文件组成的，这些网页文件存放在Web服务器的一个或若干个指定的目录内。
主页：主页（HomePage）是网站中的一个特殊页面，是用户连接到网站时默认显示的第一个网页，即用户连接到网站时首先看到的页面。
2．答：从网页制作技术的角度来说，主页与其他网页没有什么本质的不同。
但在网站中，主页的文件名通常是固定的，例如index.htm或default.htm等，是在Web服务器软件中设臵的。
3．答：包括超文本标记语言（HTML）、层叠样式表（CSS）、脚本语言（JavaScript）、动态HTML（DHTML）、动态网页技术（ASP、PHP、JSP等）、可扩展标记语言（XML）等。
XML并不是被开发出来取代HTML的，而是用以弥补其不足的。
4．答：通常动态网页指得是，Web服务器能够通过HTML表单收集用户的信息，用户也可以通过网页获得自己想要的信息，一般采用数据库技术，实现网页的界面和内容的分离，并使得网站内容的更新和维护非常方便。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
第2章文本格式与超链接
（1）段落格式
本章目标
•掌握段落标记符p、断行标记符br、标题标记符h1~h6、水平线标记符hr的用法。
•理解物理字符样式和逻辑字符样式。
•掌握使用ol/ul 和 li 标记符创建列表。
•掌握使用 a 标记符创建页面链接和锚点链接。
段落格式
•段落格式是指针对 HTML 文档中的段落所设置的格式，例如段落的对齐方式。
•还有哪些段落格式？
•首行缩进是不是段落格式？段间距呢？
分段标记符
•分段标记符用于将文档划分为段落，标记为<p></p>。
•换行标记符用于在文档中强制断行，标记为一个单独的<br />。
标题样式
•hn 标记符 = 各级标题
•n 是1至6的数字；h1表示最大的标题，h6表示最小的标题。
•注意：使用标题时应按照其逻辑含义，而不是按照其显示效果！
添加水平线
•添加水平线的标记符为hr，它包括以下属性：–size （粗细）
–width （长度）
–noshade （实线）
align 属性
•align 属性用于设置段落的对齐格式，取值：right（右对齐）、left（左对齐）、center（居中对齐）和 justify（两端对齐）。
•align 属性可应用于多种标记符，例如p、hn（标题标记符）、hr 等。
•注意：在学习了CSS技术之后应避免使用align属性。
第2章文本格式与超链接（2）字体格式与列表
字体格式
•字体格式/字符格式是指针对段落中的部分文字所设置的格式，通常包括：字体样式、字号、文字颜色等。
•注意：字体格式属于显示效果的设置，因此应主要使用CSS技术来实现。
物理字符样式
•物理字符样式是指标记符本身说明了所修饰的效果。
•常用物理字符样式标记符有：–黑体标记<b></b>
–斜体标记<i></i>
–下划线标记<u></u>
逻辑字符样式
•逻辑字符样式是指标记符本身说明了所修饰效果的逻辑含义，例如address标记符。
•常用逻辑字符样式：
–<strong></strong>
–<em></em>
–<code></code>
•有序列表是一种在表的各项前显示有数字或字母的缩排列表，表示一种顺序的关系。
•定义有序列表的语法如下：
<ol type=”1|A|a|I|i”>
<li>List item 1</li>
<li>List item 2</li>
</ol>
•属性type用来设置数字序列样式，取值为：1、A、a、I、i。
•无序列表是一种在表的各项前显示有特殊项目符号的缩排列表，表示并列关系。
•定义无序列表的语法如下：
<ul type=”disc|circle|square”>
<li>List item 1</li>
<li>List item 2</li>
</ul>
文本元素总结
块元素
•h#
•p
•pre •address •blockquote 行内元素•em •strong •sub
•sup
换行
•br 通用元素•div •span
列表•ul
•ol
•li
展示元素•b
•i
•u •small •hr
核心文档结构元素
•h1~h3
•p
•ul, ol, li
谢谢！
第2章文本格式与超链接
（3）超链接
超链接基础
• URL（Universal Resources Locator）用于定位Web上的文档信息。
•一个 URL 包括 3 部分：协议、计算机地址、文件路径。
•协议：//计算机/文件路径
超链接基础——绝对URL
•绝对URL是指资源的完整地址，包括所有3个部分，即：•协议：//计算机/文档名
•相对URL是指Internet上资源相对于当前页面的地址，它包含从当前页面指向目标页面位置的路径。
•使用相对URL的好处：易于维护
•使用相对URL时，经常使用两个与DOS类似的符号：–句点（.）表示当前目录
–双重句点（..）表示当前目录的上一级目录
•根据超链接的目标文件不同，分为：–网页之间的超链接
–页面内的超链接
–文件下载超链接
–Email超链接
–空超链接
•根据超链接源对象的不同，分为：–文本超链接
–图像超链接（包括图像映射）
–对象超链接（例如Flash、Java小程序）•根据超链接实现方式的不同，分为：–HTML超链接
–JavaScript超链接
–对象超链接
创建超链接
• a 标记符用于创建超链接，href 属性用于指定超链接的目标文件。
•内部网页超链接：<a href=wow.htm> 关于魔兽世界</a>
•外部网页超链接：
•使用页面内的超链接，首先需要定义锚点，然后在超链接中指向该锚点。
定义锚点应使用<a name=xxx></a>•指向锚点的超链接为：<a href=#锚点名称>link</a>
•指向其他页面内锚点的超链接：<a href = 页面的URL#该文件中的锚点>link</a>
•<a href= # >blank link</a>
•<a href="图2-5.htm#yyjb">夜雨寄北</a>
创建超链接——文件下载
•当超链接目标为浏览器不能识别的文件格式时，那么就自动生成了文件下载链接。
•<a href=xxx.zip>下载</a>
创建超链接——Email链接
•<a href=mailto:i@>Email</a>•控制命令：
–?subject= 设置信件主题
–?cc= 设置抄送人
–?bcc= 设置密件抄送人
–& 组合多个控制命令
谢谢！
第2章文本格式与超链接
（4）综合实例
站点目录设计
谢谢！。