HTML1.docx
《HTML1.docx》由会员分享，可在线阅读，更多相关《HTML1.docx（20页珍藏版）》请在冰豆网上搜索。
HTML1
Web是什么
Web又称做万维网或环球网，是WWW（WorldWideWeb）的简称，WWW是实质上是一个超文本信息系统
●Web的功能
▪发布信息
▪搜索和浏览文本和图片信息
▪在线播放音、视频文件
▪发表观点
▪电子购物
●Web的实质
▪Web是基于Internet的一个多媒体信息服务系统
✓它基于客户/服务器模式，整个系统由Web服务器、浏览器（Browser）和通信协议等三部分组成
✓通信协议采用的是HTTP协议
✓HTTP协议是超文本传输协议（HypertextTransferProtocol）的简写，HTTP协议处于TCP/IP协议簇的应用层
●基本原理概述
▪在Web服务器上，主要以网页（WebPage）的形式来发布多媒体信息
▪网页采用超文本标记语言HTML（HyperTextMarkupLanguage）来编写
▪当浏览器软件连接到Web服务器并获取网页后，通过对网页HTML文档的解释执行将网页所包含的信息显示在用户的屏幕上
●Web的基本组织形式
▪Web是一个超文本文件的集合
▪超文本文件是Web的基本组成单元，也称为网页或HTML文档、Web页等，通常是以.html或.htm为后缀的文件
▪Web页之间通过超文本中的超级链接组织在一起
●超文本
▪是格式和存储位置均可不同的文件，通过某种方式组织在一起共同来表述一件事情的组织形式
▪超级链接是超文本用来串连信息的“绳索“，又叫做URL
●超文本的“绳索”——超链接
▪超文本中除了要传达的文字图片等信息外，还包括一类很重要的信息--------超级链接
▪超链接指向的是一个用URL标识的网络资源（文件，图片，媒体等）
▪网页中有超链接的文字或图片一般有特殊的显示方式（下划线或手形鼠标）
●Web的编写语言
▪HTML（HyperTextMarkupLanguage，超文本标记语言）是编写Web页的语言
✓HTML语言使用带有尖括号的“标记”将网页中的内容逐一标识出来（被标识的部分叫做“元素”），这样做可以让网页以字符流的方式在网络中流动，在用户端使用特殊的软件（浏览器）对这些字符流进行翻译并按照标识的要求显示出来
✓
第一个网页<title></head></p><p><body></p><p><h1><fontcolor="#666666">欢迎进入网页制作天地</font></h1></p><p></body></html></p><p>▪HTML是一个扩展性很强的语言，可以嵌套用脚本语言编写的程序段</p><p>这些脚本语言如：</p><p>VBScript，JavaScript</p><p>HTML语言的起源</p><p>●HTML是一种标记语言，起源于SGML（StandardGeneralizedMarkupLanguage）标准通用标记语言</p><p>▪SGML是定义电子文档结构和描述其内容的国际标准语言</p><p>▪SGML在Web发明之前就存在</p><p>▪HTML是SGML的子集</p><p>●HTML由TimBerners-Lee和同事NanielW.Connolly在瑞士日内瓦的欧洲粒子实验室发明，伴随着WEB一起诞生</p><p>HTML的管理机构:</p><p>万维网组织</p><p>●W3C（WorldWideWebConsortium）是一个非营利性的负责为HTML制定标准的机构,负责关于万维网的标准的制定,可以通过访问网址www.w3.org了解更多关于W3C的内容</p><p>HTML相关术语</p><p>●标记</p><p>▪标记是用尖括号<>包围的单词,很多标记是成对的，一个是开始标记,一个是结束标记（单词前加/）</p><p>●元素</p><p>▪每一对尖括号包围的部分</p><p>✓比如由<body>xxx</body>包围的部分就叫做body元素</p><p>▪元素通常由三个部分组成</p><p>✓开始标记</p><p>✓内容</p><p>✓结束标记</p><p>●属性</p><p>▪用来修饰元素</p><p>▪每个属性都有值</p><p>▪属性放在开始标记中</p><p>✓<fontsize="3">Oracle</font></p><p>HTML元素</p><p>●块级元素</p><p>▪指一些元素可以在浏览器中用一个矩形框（块）来表示，即使不显示任何内容也可以用这样一个空白矩形来作为占位符</p><p>✓如p、body、div元素等</p><p>●内联元素</p><p>▪指在文档中插入到块元素中的那部分元素</p><p>▪作用：</p><p>可以控制在块元素内进行如强调、引用、斜体等特殊格式变化</p><p>✓包括em（加强）、span（内联元素分组）、sub（下标）、sup（上标）等</p><p>编辑HTML</p><p>●纯文本类型的语言</p><p>●编辑方式简单</p><p>●HTML文档所有的部分都由某种标记包围着，为了和今后的版本兼容，标记单词最好用小写</p><p>●由HTML编写的文件以后缀.html或.htm保存</p><p>▪以.htm为扩展名主要是为了和某些操作系统兼容。</p><p>在一些操作系统中比如dos对扩展名的位数有限制（3位）</p><p>HTML表达方式</p><p>●一般来说，HTML的语法有三种表达方式，如下所示：</p><p>▪<标记>内容</标记></p><p>▪<标记属性1=参数1属性2=参数2>内容</标记></p><p>▪<标记></p><p>HTML基本语法</p><p>●<标记>内容</标记>--封闭类型标记</p><p>▪大多数标记是封闭类型的，它们成对出现，在内容的前面是一个标记，而在内容的后面是另一个标记，第二个标记元素前带有反斜线，表明结束标记对内容的控制</p><p>✓示例：</p><p><h1>这是标题</h1></p><p>▪如果一个应该封闭的标记没有被封闭，则会产生意料不到的错误</p><p>●<标记>（空标记）--非封闭类型标记</p><p>▪最常用的是换行标记<br></p><p>✓如果希望使一行文字换行（但是仍然同上面的文字属于一个段落），则可以在文字要换行的地方添加标记<br>，例如：</p><p>▪此类型还有base,link,meta标记等</p><p>●标记嵌套</p><p>▪标记之间可以相互嵌套，形成更为复杂的语法</p><p>例如：</p><p>HTML文档的结构</p><p>●一个HTML文档可以看成由以下三个部分构成：</p><p>▪版本信息</p><p>▪文档头</p><p>✓由<HEAD></HEAD>标识</p><p>▪文档主体部分</p><p>由<BODY></BODY>标记标识</p><p>版本信息</p><p>●文档类型定义（DOCUMENTTYPEDEFINITION，DTD）：</p><p>对文档中使用的HTML语言的版本进行说明</p><p>文件头元素</p><p>●<HEAD></HEAD></p><p>▪HEAD元素包含了与当前文档相关的信息，如文档的标题、关键字（如果该文档希望被搜索引擎搜索到，各部分信息很重要）、以及一些和文档内容无关仅对文档本身进行说明的数据信息</p><p>●开始标记：</p><p><head>可选</p><p>●内容：</p><p>▪title标题元素</p><p>▪base文档基础目录元素</p><p>▪meta元数据元素</p><p>▪script脚本元素</p><p>▪style内部样式表的样式元素</p><p>▪link链接元素连接到外部样式表</p><p>▪object对象元素</p><p>●结束标记：</p><p></head>可选</p><p>●head元素主要属性</p><p>▪lang：</p><p>语言</p><p>▪dir：</p><p>元素中内容的文本方向</p><p>▪profile：</p><p>由空格分隔的URL列表，这些URL包含着有关页面的元数据信息</p><p>标题元素</p><p>●<title>元素
▪标题元素的内容出现在浏览器顶部
▪没有属性
▪必需出现在head元素中且只能有一个标题元素
元数据元素
●元数据元素
▪meta的意思是“关于”
▪它是关于某个网页的基本信息
▪搜索引擎对meta元素中数据进行搜索可以帮助访问者找到该网页
文档主体元素
●
▪body元素代表网页要显示给读者的内容，几乎所有要显示的内容都被包括在
……里面
●语法：
●开始标记：
可选
●内容：
▪可以包含除了html、head外所有元素
●结束标记：
可选
●主要属性
▪background背景图像的URL
▪text文本的颜色
▪link链接的颜色
▪vlink已访问过的链接的颜色
▪alink活跃链接的颜色
▪bgcolor背景色
▪id、class为样式表设置的标识属性
▪title提示文字（与tilte元素不同）
▪style样式信息
网页中的文本
●网页中的信息主要是通过文本传递的，所以文本是Web信息的基本构成。
下面介绍与文本编辑有关的元素，包括：
▪
段落标记
▪
预定标记▪
换行标记
▪
缩进标记▪
、
区块标记▪
水平线标记▪、强调标记
▪
文本标题标记
▪
列表标记▪
- 定义列表标记
段落元素的语法
●开始标记：
必需
●内容：
▪嵌套其它块元素
▪内联元素
▪文本
●结束标记：
可选
预定义元素●
的作用▪预定义格式的作用是告诉浏览器被包含在其中的文本必须被如下对待：
✓原封不动地保留空白区域
✓可以用组合字体来显示文字
✓禁止自动单词换行
●开始标记：
必需●内容：
▪嵌套其它块元素
▪内联元素
▪文本
●结束标记：
必需●主要属性
▪Id、class、align、title、style、lang等
blockquote缩进元素
●
▪
标记本来使用于文本中的引用，现在使用都是把它作为缩进文本的手段▪无属性
div块元素分组
●
的作用
▪为块元素提供分组的方法
▪常被用于和样式表配合使用
▪
还被用来作为层用于页面布局
●开始标记：
必需
●内容：
▪嵌套其他块元素
▪内联元素
▪文本
●结束标记：
必需
●主要属性
▪id、class、align、title、style、lang等
内联元素分组
●元素的作用
▪span提供了一种对内联元素分组的方法
▪span常用来和样式表配合
▪往往被用来设置同一行文字内的不同格式
●开始标记：
必需
●内容：
▪嵌套其他块元素
▪内联元素
▪文本
●结束标记：
必需
●主要属性
Id、class、align、title、style、lang等
水平线元素
●
的作用
▪该元素可以在文档中划一条水平线，当文档比较大时常用来分割文档
加强元素和强调元素
●Strong和em
▪默认效果：
给字体加粗和斜体显示
▪开始标记：
必需
文本标题元素
●
标题1-标题6
▪这六个元素的作用是让文字以醒目的方式显示，往往用于文章的标题
列表元素
●
展开阅读全文
相关搜索