网站建设实用技术ppt课件.ppt

本章内容 HTML语言CSS层叠样式表ASP NET HTML语言简介HTML文档的基本结构在网页中插入文字 并设置文字格式在网页中插入图画 并设置图片属性 一 HTML语言 主要内容 学会制作简单网页 教学目标 3 1HTML语言简介 3 1 1HTML的概念 什么叫HTML语言 HTML HypertextMarkupLanguage 超文本标记语言 是一种用来制作超文本文档的简单标记语言 3 1HTML语言简介 3 1 1HTML的概念 什么叫HTML文档 用HTML编写的超文本文档称为HTML文档 它能独立于各种操作系统平台 HTML文档需要通过WEB浏览器显示出效果 就是所谓的 网页 3 1HTML语言简介 3 1 2HTML的应用 HTML语言用于什么场合 HTML语言可用于网页的排版 是网页设计的基础 用于描述网页的内容及显示格式 建立网页间的超链接等 3 1HTML语言简介 3 1 3HTML的特点 HTML有什么特点 HTML具有简单 易学 易用 易于实现的特点 但是随着信息技术的发展 HTML显现出难以突破的局限性和缺点 所以相继出现了许多新的标记语言 如XHTML XML等 正在WWW上广泛应用 3 1HTML语言简介 3 1 4HTML文档的浏览 怎样将HTML文档以网页的形式呈现给浏览者 简言之 在浏览器中打开HTML文档 浏览者就看到你所设计的网页了 HTML不是编程语言 而是一种标记语言 3 2HTML文档的基本结构 开始 结束 首部 主体 一个HTML文档实例 例3 1 简单的HTML示例 我的第一个网页这是我做的第一个网页 欢迎光临 谢谢 看看浏览效果吧 一个HTML文档是由一系列标签组成的 标签的格式 标签的作用 控制文本 图像的显示方式及加于其上的动作 例如 等 1 标签 3 2HTML文档的基本结构 几个概念 有些标签具有参数 这些参数精确地定义显示方式或行为等 被称为该标签的属性 属性的用法 例如 属性size设置受限文字的大小 2 是属性值 2 标签的属性 3 2HTML文档的基本结构 几个概念 标签的嵌套是指一个标签可以放在另外一个标签的作用区域中 以实现对文档中某一段内容的多重标签控制 例如 HTML文档示例 3 标签的嵌套 3 2HTML文档的基本结构 几个概念 内容 网页中要显示的文字 图片 要播放的声音 影像等 标签 规定网页内容显示的格式 网页间链接关系等 如字体 字形 字号 表格 图片的大小 位置 还有些文档格式标签 HTML文档中包含两种信息 3 2HTML文档的基本结构 几个概念 3 3HTML文档的页面控制标签 3 3 1HTML文档标签 作用 HTML文档标签用于界定一个完整的HTML文档 格式 和标签限定了HTML文档的开始和结束 3 3 2HTML首部的常用标签 3 3HTML文档的页面控制标签 1 HEAD标签作用 HEAD标签用于定义HTML文档的首部格式 2 TITLE标签作用 TITLE标签用于定义HTML文档的标题格式 3 3 3HTML文档主体标签 3 3HTML文档的页面控制标签 BODY标签用于定义文档主体 主体是网页的实质部分 是放置文档核心内容的地方 格式 常用属性 background bgcolor link alink vlink text leftmargin topmargin 网页背景 3 3 3HTML文档主体标签 3 3HTML文档的页面控制标签 1 设置网页背景颜色格式 2 设置页面背景图象格式 3 3 3HTML文档主体标签 3 3HTML文档的页面控制标签 文字颜色 3 设置网页文字及超链接的颜色格式 text 普通文字的颜色link 超链接文字的颜色alink 活动超链接文字的颜色vlink 访问过的超链接文字的颜色 3 3 3HTML文档主体标签 3 3HTML文档的页面控制标签 页边空白 4 设置页边空白格式 其中 为像素值 Leftmargin 设置页面左边的空白Topmargin 设置页面上方的空白 3 3 3HTML文档主体标签 3 3HTML文档的页面控制标签 与之间内嵌的是网页的核心 是网页中要显示在浏览器窗口中的各种内容以及这些内容的显示格式等信息 Body总结 3 4在网页中插入文字 1 以默认格式显示文字 Thisismyfirstweb Welcome 这是我做的第一个网页 欢迎光临 例3 2 简单的HTML示例 看看浏览效果吧 3 4在网页中插入文字 2 设置文字的显示格式 在网页中设置显示文字的字体字号 用FONT标签 格式 常用属性 face设置文字的字体size设置文字的大小color设置文字的颜色 设置字体字型字号及文字颜色 例3 3 3 4在网页中插入文字 幼圆黑色size 看看浏览效果吧 在HTML中提供了标题标签 用于在浏览窗口中显示文章及章节的标题 格式 文章标题常用属性 align 用于规定标题文字的对齐方式 3 4在网页中插入文字 3 设置文章标题 注意理解与的区别 设置文章标题 看看浏览效果吧 例3 4 3 4在网页中插入文字 一级标题 默认左对齐二级标题 用 center 设置为居中对齐四级标题 用 right 设置为右对齐六级标题 用 right 设置为左对齐 3 5在网页中插入图片 1 在网页中插入图片 在网页中插入图片 用IMG标签 格式 常用属性 Src 图片的地址 URL hspace 水平间距Align 对齐方式vspace 垂直间距Border 边框宽度width 图片的宽度Alt 替代文本height 图片的高度 插入图片示例 看看浏览效果吧 例3