HTML简介及其基本标记.ppt

《HTML简介及其基本标记.ppt》由会员分享，可在线阅读，更多相关《HTML简介及其基本标记.ppt（33页珍藏版）》请在三一办公上搜索。

1、第一章：HTML 简介及其基本标记,WebHTML简介HTML文档结构HTML基本标签使用列表和超链接,1,1.1 Web,常用术语浏览器：是客户软件，它使用户能够显示一超文本文档并与之对话Web服务器：响应Web浏览器检索资源的请求。它也用来指运行服务器程序的计算机。主页：它是当用户选择连接到任何Web服务器时被显示的第一个超文本文档。HTML（Hypertext Markup Language/超文本标记语言）：是用来创建Web文档的编码形式。HTTP（Hypertext Transfer Protocol/超文本传输协议）：是用来在Web上传输超文本的协议。所谓协议是计算机用来通讯的一套

2、规则。URL（Uniform Resource Locator/统一资源定位器）：是一精确定位因特网资源的Web寻址形式。任何从一个文档到另一个文档的链接总是通过使用URL去实现。URL包含了关于文档地址的信息。一个URL可以指向另一HTML文档或者一个图象。,2,W3C,World Wide Web Consortium 对网络标准制定的一个非赢利组织，像HTML、XHTML、CSS、XML的标准就是由W3C来定制使命：通过发展规范、指导方针、软件以及工具，来尽展万维网潜能,3,第一章：HTML 简介及其基本标记,WebHTML简介HTML文档结构HTML基本标签使用列表和超链接,4,1.2

3、 HTML简介,HTML:超文本标记语言Web用于创建和识别文档的标准语言通用的语言，独立于平台，能够在任何平台上使用使用标签：标记文档，指定页面的显示方式包含链接：使得用户可以跳到同一文档的不同位置或跳到其他文档资料、图像等css（Cascading Style Sheets）层叠样式表 样式Js（Javascript）行为,5,HTML参考书籍,6,第一章：HTML 简介及其基本标记,WebHTML简介HTML文档结构HTML基本标签使用列表和超链接,7,1.3 HTML文档结构,HTML文档结构HTML编辑器：Dreamweaver、Sublime、记事本HTML文档：一系列的标签，指定

4、页面的显示方式标签：开始标签：，结束标签：开始标签和结束标签之间的文本：元素的内容属性属于标签，可选用于在标签中修饰或进一步指定信息，如颜色、对齐方式、高度和宽度等。属性以名称/值对出现：名称=值。属性只能添加到开始标签,8,1.3 HTML文档结构,HTML文档主要由三部分组成：HTML部分：以标签开始，以标签结束头部：以标签开始，以标签结束。主体部分：以标签开始，以标签结束,9,HTML课程你现在来到的是HTML第一课,第一章：HTML 简介及其基本标记,WebHTML简介HTML文档结构HTML基本标签使用列表和超链接,10,1.4 HTML基本标签,标题标签：6级标题，最大，最小,11

5、,HTML课程你现在来到的是HTML第一课 你现在来到的是HTML第一课你现在来到的是HTML第一课你现在来到的是HTML第一课你现在来到的是HTML第一课你现在来到的是HTML第一课,1.4 HTML基本标签,段落标签：用于标记段落的开始：段落结束标记，并非是必需的align属性：对齐方式，如左对齐、居中、右对齐,12,HTML课程你现在来到的是HTML第一课你现在来到的是HTML第一课你现在来到的是HTML第一课,1.4 HTML基本标签,换行标签：结束一行，不开始一个新的段落预格式化标签:被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。标签的常见应用就是用

6、来表示计算机的源代码,13,1.4 HTML基本标签,14,HTML课程这是预格式文本。它保留了 空格和换行。pre 标签很适合显示计算机代码：for i=1 to 10 print inext i,1.4 HTML基本标签,文本格式化标签用于格式化HTML文本内容,定义或更改文本的显示格式标签粗体字体显示文本标签用斜体字体显示文本标签为显示的文本添加下划线标签使文本的高度低于周围的文本，并以更小的字体进行显示标签使文本的高度高于周围的文本，并以更小的字体进行显示,15,1.4 HTML基本标签,16,HTML课程你现在来到的是HTML第一课你现在来到的是HTML第一课你现在来到的是HTML第

7、一课你现在来到的是HTML第一课你现在来到的是HTML第一课,1.4 HTML基本标签,标签用于在页面上绘制水平线只有开始标签，没有结束标签属性：ALIGN：指定水平线的位置，可以将水平线居中对齐、右对齐或左对齐。WIDTH：指定水平线的长度。可以按像素或百分比为单位指定长度。默认值为100%。SIZE：指定水平线的宽度，以像素为单位。NOSHADE：指定水平线以纯色而不是以阴影进行显示。,17,1.4 HTML基本标签,标签位于网页的标题部分提供有关网页的信息，比如针对搜索引擎和更新频度的描述和关键词name 属性name 属性提供了名称/值对中的名称http-equiv 属性http-eq

8、uiv 属性为名称/值对提供了名称指示服务器在发送实际的文档之前先在要传送给浏览器的 MIME 文档头部包含名称/值对,18,1.4 HTML基本标签,19,本文档的 meta 属性标识了创作者和编辑软件。,1.4 HTML基本标签,标签用于控制网页上文本的显示。文本大小、颜色和样式等属性都可使用它来指定。属性COLOR：用于指定字体的颜色。可以指定颜色名称或十六进制值SIZE：用于指定字体的大小。可以为字体指定的大小范围为从1到7，默认大小为3。FACE：用于指定字体的类型,20,1.4 HTML基本标签,标签用于在HTML文档中嵌入图像并不会在网页中插入图像，而是从网页上链接图像标签有两个

9、必需的属性：src 属性 和 alt 属性,21,1.4 HTML基本标签,22,未设置对齐方式的图像：图像 在文本中已设置对齐方式的图像：图像 在文本中图像 在文本中图像 在文本中请注意，bottom 对齐方式是默认的对齐方式。,1.4 HTML基本标签,特殊字符某些字符在HTML中具有特殊意义，如小于号（）即定义HTML标签的开始。要在浏览器中显示这些特殊字符，就在HTML文档中使用字符实体字符实体由三部分组成：&号、实体名称和分号（；）。例如：要在HTML文档中显示小于号，则使用<,示例,任务场景Jessup是电子消费品制造公司，其产品包括：电冰箱、空调、洗衣机、电视机和家用炊具等。

10、该公司成立于1982年，通过其积极的市场政策和对产品的不断推陈出新，现在已成为家用电器产品的主流生产厂商该公司为了能及时了解有关部门的经理设置情况，需要建立Web页，以便随时查看要求：页面简洁、层次清晰页面,24,第一章：HTML 简介及其基本标记,WebHTML简介HTML文档结构HTML基本标签使用列表和超链接,25,1.5 使用列表和超链接,列表标签列表用于按逻辑方式对数据分组在HTML文档中可创建以下不同类型的列表：无序列表、有序列表 无序列表 项目列表，列表项前面带有项目符号 列表中每项都用列表标签标记，其中LI表示列表项。结束标记为可选项,1.5 使用列表和超链接,HTML课程第一

11、课的内容有 因特网 万维网 统一资源定位器 超文本标记语言 HTML文档结构 创建WEB页,1.5 使用列表和超链接,有序列表有序列表的列表以自动生成的顺序显示,1.5 使用列表和超链接,HTML课程第一课的内容有 因特网 万维网 统一资源定位器 超文本标记语言 HTML文档结构 创建WEB页,1.5 使用列表和超链接,超链接标签 超链接是到另一个文档或文件（图形、音频、视频等）甚至到同一个文档的另一部分的连接超链接可链接到：同一文档的特定部分、其他文档、其他文档的特定部分、其他文件、其他站点 创建超链接要链接文件的完整地址或URL将提供链接的热点。热点可以是文本行，甚至是图像。当用户单击热点

12、时，浏览器将读取URL中指定的地址并跳到新的位置 标签 HREF参数用于指定要链接文档的地址或URL 页面,1.5 使用列表和超链接,链接到其他目录中的文件绝对路径名：指定从根目录到文件的完整路径。相对路径名：指定相对于当前文件的文件位置。链接到文档的各个部分标签的name属性来创建锚记 在链接地址里要写上锚记名称，并在前面加一个“#”本公司简介本公司简介,示例,任务场景 Jessup公司高层管理不仅需要查看相关部门经理的名单，而且希望通过点击经理名字能以列表的方式查看到该经理的详细介绍，为此需要建立新的Web页 页面,小结,因特网是一个全世界的人们都能访问的信息海洋。万维网是通过超文本内联的一系列服务器。HTML文档是包含标记标签的文本文件。这些标签告诉Web浏览器如何显示页面。HTML标签不区分大小写。标签都具有属性。属性进一步描述网页上HTML元素的附加信息。META标签放置在网页的标题处，以提供关于页面的信息。搜索引擎通常会用到这些标签。锚记标签用于标识充当HTML文档中超链接的文本或图像。HREF参数指定要链接的文件的地址,