HTML超文本标记语言速查手册
- 格式:doc
- 大小:210.89 KB
- 文档页数:31
HTML开发技术手册HTML(超文本标记语言,HyperText Markup Language)是一种用于创建网页的标准标记语言。
它描述了网页的结构和语义,并且通过标签来定义文档的样式和布局。
作为Web开发的基础,HTML的掌握对于开发人员来说至关重要。
本手册将介绍HTML开发技术的基本知识和一些常用的技巧。
一、HTML的基本结构HTML文档以`<!DOCTYPE>`声明开始,用于告诉浏览器使用哪个HTML版本解析网页。
接下来是`<html>`标签,表示HTML文档的根元素。
在`<html>`标签内,有`<head>`和`<body>`两个主要部分。
`<head>`标签用于定义文档的元信息,如标题、字符编码等;`<body>`标签则用于定义文档的内容。
二、HTML元素与标签HTML文档由一系列的标签构成,每个标签可以包含内容,也可以有属性来定义标签的特性。
常见的HTML标签有:- `<h1>`到`<h6>`:用于定义标题,数字越小,表示级别越高。
- `<p>`:用于定义段落。
- `<a>`:用于创建链接。
- `<img>`:用于插入图像。
- `<ul>`和`<ol>`:用于创建无序列表和有序列表。
- `<div>`和`<span>`:用于划分文档结构和样式控制。
三、HTML属性HTML标签可以包含属性,属性一般用来定义标签的特性或提供额外的信息。
常见的HTML属性有:- `class`:用于给元素添加一个或多个类名。
- `id`:用于定义元素的唯一标识符。
- `style`:用于定义元素的样式。
- `src`:用于指定图像、音频或视频资源的URL。
- `href`:用于指定链接的URL地址。
四、HTML表单HTML表单是用户与网页交互的重要手段,它提供了各种输入控件,如文本输入框、按钮、复选框等。
超文本标记语言(英文:HyperText Markup Language,HTML)超文本标记语言(英文:HyperText Markup Language,HTML)是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言。
HTML被用来结构化信息——例如标题、段落和列表等等,也可用来在一定程度上描述文档的外观和语义。
1982年由蒂姆·伯纳斯-李创建,由IETF用简化的SGML(标准通用标记语言)语法进行进一步发展的HTML,后来成为国际标准,由万维网联盟(W3C)维护。
1 基本介绍HTML(HyperText Markup Language),超文本标记语言,是一种专门用于创建Web超文本文档的编程语言,它能告诉Web浏览程序如何显示Web文档(即网页)的信息,如何链接各种信息。
使用HTML语言可以在其生成的文档中含有其它文档,或者含有图像、声音、视频等,从而形成超文本。
超文本文档本身并不真正含有其他的文档,它仅仅含有指向这些文档的指针,这些指针就是超链接。
HTML是用来制作网页的语言,网页中的每个元素都需要用HTML规定的专门标记来定义。
要让设计者在网络上发布的网页能够被世界各地的浏览者所阅读,需要一种规范化的发布语言。
在万维网(WWW)上,文档的发布语言是HTML。
标记语言是一种基于源代码解释的访问方式,它的源文件由一个纯文本文件组成,代码中由许多元素组成,而前台浏览器通过解释这些元素显示各种样式的文档。
换句话说,浏览器就是把纯文本的后台源文件以赋有样式定义的超文本文件方式显示出来。
HTML和网络是紧密相连的,HTML语言的发展和浏览器的支持是密不可分的,在20世纪90年代网络刚刚兴起时,多种浏览器同时流行于世界各地,它们支持HTML语言的标准也各不相同,这样限制了HTML标记语言本身的发展,逐渐,W3C网络标准化组织联手一些较为流行浏览器开发厂商一同定义HTML标准,并且力推浏览器解释语言和显示方法的统一。
HTML表示什么HTML(HyperText Markup Language),超文本标记语言,是一种专门用于创建Web超文本文档的编程语言,它能告诉Web浏览程序如何显示Web 文档(即网页)的信息,如何链接各种信息。
使用HTML语言可以在其生成的文档中含有其它文档,或者含有图像、声音、视频等,从而形成超文本。
超文本文档本身并不真正含有其他的文档,它仅仅含有指向这些文档的指针,这些指针就是超链接。
HTML是用来制作网页的语言,网页中的每个元素都需要用HTML规定的专门标记来定义。
要让设计者在网络上发布的网页能够被世界各地的浏览者所阅读,需要一种规范化的发布语言。
在万维网(WWW)上,文档的发布语言是HTML。
标记语言是一种基于源代码解释的访问方式,它的源文件由一个纯文本文件组成,代码中由许多元素组成,而前台浏览器通过解释这些元素显示各种样式的文档。
换句话说,浏览器就是把纯文本的后台源文件以赋有样式定义的超文本文件方式显示出来。
HTML和网络是紧密相连的,HTML语言的发展和浏览器的支持是密不可分的,在20世纪90年代网络刚刚兴起时,多种浏览器同时流行于世界各地,它们支持HTML语言的标准也各不相同,这样限制了HTML标记语言本身的发展,逐渐,W3C网络标准化组织联手一些较为流行浏览器开发厂商一同定义HTML标准,并且力推浏览器解释语言和显示方法的统一。
到今天,IE浏览器随着WINDOWS操作信息系统的绝对垄断地位占据着主流市场,这也在另一方面为HTML标准的统一起到了关键作用。
2语言特点编辑本段HTML文档制作不是很复杂,但功能强大,支持不同数据格式的文件镶入,这也是WWW 盛行的原因之一,其主要特点如下:1、简易性,HTML版本升级采用超集方式,从而更加灵活方便。
2、可扩展性,HTML语言的广泛应用带来了加强功能,增加标识符等要求,HTML采取子类元素的方式,为系统扩展带来保证。
3、平台无关性。
Html教程(1)什么是HTML文件?∙HTML的英文全称是Hypertext Marked Language,中文叫做“超文本标记语言”。
∙和一般文本的不同的是,一个HTML文件不仅包含文本内容,还包含一些Tag,中文称“标记”。
∙一个HTML文件的后缀名是.htm或者是.html。
∙用文本编辑器就可以编写HTML文件。
这就试写一个HTML文件吧!打开你的Notepad,新建一个文件,然后拷贝以下代码到这个新文件,然后将这个文件存成first.html。
<html><head><title>Title of page</title></head><body>This is my first homepage. <b>This text is bold</b></body></html>要浏览这个first.html文件,双击它。
或者打开浏览器,在File菜单选择Open,然后选择这个文件就行了。
示例解释这个文件的第一个Tag是<html>,这个Tag告诉你的浏览器这是HTML文件的头。
文件的最后一个Tag是</html>,表示HTML文件到此结束。
在<head>和</head>之间的内容,是Head信息。
Head信息是不显示出来的,你在浏览器里看不到。
但是这并不表示这些信息没有用处。
比如你可以在Head信息里加上一些关键词,有助于搜索引擎能够搜索到你的网页。
在<title>和</title>之间的内容,是这个文件的标题。
你可以在浏览器最顶端的标题栏看到这个标题。
在<body>和</body>之间的信息,是正文。
在<b>和</b>之间的文字,用粗体表示。
<b>顾名思义,就是bold的意思。
计算机网络原理超文本标记语言(HTML)超文本标记语言HTML(HyperText Markup Language)中的Markup的意思就是“设置标记”。
因此HTML也常译为超文本置标语言。
早在1986年,ISO就已经制定了标准的ISO8879,即SGML(Standard Generalized Markup Language)。
SGML是一个非常复杂的、功能丰富的系统,有很多种选项,很适合于需要精确文档标准的大型组织。
然而SDML的过分复杂使用它很不适合于简单快捷的WWW网。
由于HTML非常易于掌握且实施简单,因此它很快就成为WWW的重要基础。
官方的HTML标准由WWW Consortium负责制定。
1.HTML文件描述这类标记是每一个HTML文件都应该具有的,但是请注意,即使没有这些标记,浏览器也不会显示出错,而是按照默认的方式解释代码内容并显示页面。
●HTML文本标记<html></html><html>标记表示这是HTML文本文件,基本HTML页面以<html>标记开始,以</html>结束。
在它们之间,文件有两部分—标题和正文。
●文件头部标记<head></head>这个标记表示文件头部的描述,包含一个不在自己页面上出现的页面信息,例如标题名称(title),一些有关浏览器的定义和说明。
●页面标题<title></title>定义的页面标题,这个标记之间的文字在被访问时将出现在浏览器窗口标题的地方。
●页面主体<body></body>页面内容所在。
主页面上显示的东西都包含在这两个标记之中。
在它的起始标记中可以包括一些页面属性,它们在整个页面有效:background:背景图片文件名;bgcolor:背景颜色;link:超级链接的颜色,一般浏览器默认为蓝色;text:设定本页面文本的颜色;vlink:已经看过的超级链接的颜色,默认为紫色。
HTML超⽂本标记语⾔(HyperTextMarkupLanguage)1、HTML是什么HTML指的超⽂本标记语⾔(Hyper Text Markup Language),是⼀种⽤来描述⽹页的语⾔。
超⽂本指的是除了可以包含⽂字之外,还可以包含图⽚、链接、⾳乐、视频、程序等内容。
(每个都需要⼀个标记,在⽹页中通过不同的标记组成起来。
)HTML 指的是超⽂本标记语⾔ (Hyper Text Markup Language)HTML 不是⼀种编程语⾔,⽽是⼀种标记语⾔ (markup language)标记语⾔是⼀套标记标签 (markup tag)HTML 使⽤标记标签来描述⽹页前端三剑客。
2 常⽤的HTML标签① html 根标记② head 头标记③ body 体标记④ a 超链接⑤ form 表单⑥ table 表格<!--⼀个HTML页⾯最基本的组成部分html: 跟标记head:头标记写描述性的信息(css\javaScricpt)body: 体标记写页⾯显⽰的信息--><html><head></head><body>想写什么<!--标题标记 h1....--><h1 align="center">E</h1><h2 align="right">E</h2><h3 align="left">E</h3><!--超链接 href 可以指定应⽤内或者是应⽤外的任意地址--><a href="">跳转连接</a><!-- 表格--><h1 align="center">Information</h1><table border="lpx" align="center" width="60%"><!--内部是属性设置--><!--tr : 表⽰⼀⾏--><tr><!--th: 标题列⾃带剧中并加粗效果td: 普通列--><th>ID</th><th>Name</th><th>Age</th></tr><td>12234</td><td>Zhang</td><td>Mail</td><tr></tr></table><!--表单:收集⽤户的信息,提交到后台服务器--><form action="提交的地址,例如" method="GET/POST">⽤户名称:<input type="text" name="username" value="admim"/><!--数据的提交⽅式:username=admin ,此时username相当于⼀个key --><br/><!--换⾏-->⽤户密码:<input type="password" name="password"/>⽤户性别:男<input type="radio" name="gender" value="1"/>⼥<input type="radio" name="gender" value="0"/><!--通过在radio指定相同的name 来表⽰互斥的关系--><br/>⽤户爱好:⽻⽑球<input type="checkbox" name="hobby" value="1"/><!--checkbox表⽰多选框-->篮球<input type="checkbox" name="hobby" value="2"/>乒乓球<input type="checkbox" name="hobby" value="3"/><br/>⽤户地址:省份<select name="province"><!--select 表⽰下拉列表--><option value="hb">河北省</option><option value="js">江苏省</option><option value="ah">安徽省</option></select><br/><input type="submit" value="注册"/><!--表⽰按钮,点击后向 action中的地址进⾏数据的提交--></form></body></html>3、表现CSSCSS 指层叠样式表 (Cascading Style Sheets)样式定义如何显⽰ HTML 元素样式通常存储在样式表中把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问题外部样式表可以极⼤提⾼⼯作效率外部样式表通常存储在 CSS ⽂件中多个样式定义可层叠为⼀ <div></div>:选中⼀部分区域,施加⼀些样式。
注:粗体显示的为HTML保留字。
<!-- -->说明:注释标记,在“<!--”与“-->”之间的内容将不在浏览器中显示。
<!DOCTYPE>说明:描述文件所符合的HTML DTD,用于对文件的兼容性作简要说明。
<AACCESSKEY=keyCLASS=classnameDATAFLD=colnameDATASRC=#IDHREF=urlID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBSMETHODS=http-methodNAME=nameREL="stylesheet"REV="stylesheet"STYLE=css1-propertiesTABINDEX=nTARGET=window_name | _blank | _parent | _self | _topTITLE=textURN=urnevent=script>说明:描述超级链接的开始位置或者目标。
要求必须定义herf=或name=属性。
需要结束标记。
<ACRONYMCLASS=classnameID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBSSTYLE=css1-propertiesTITLE=textevent=script>说明:说明一个缩写词。
该标志不影响浏览器中文本的显示。
需要结束标记<ADDRESSCLASS=classnameID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBSSTYLE=css1-propertiesTITLE=textevent=script>说明:常用于描述地址、签名和作者信息。
需要结束标记。
<APPLETALIGN=ABSBOTTOM| ABSMIDDLE| BASELINE| BOTTOM| LEFT| MIDDLE | RIGHT | TEXTTOP | TOPALT=textCLASS=classnameCODE=filenameCODEBASE=urlDATAFLD=colnameDATASRC=#IDHEIGHT=nHSPACE=nID=valueNAME=nameSRC=urlSTYLE=css1-propertiesTITLE=textVSPACE=nWIDTH=nevent=script>说明:在页面中放置可执行的内容。
需要结束标记。
<AREAALT=textCLASS=classnameCOORDS=coordinatesHREF=urlID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBSNOHREFSHAPE=CIRC | CIRCLE | POLY | POLYGON | RECT | RECTANGLE STYLE=css1-propertiesTABINDEX=nTARGET=window_name | _blank | _parent | _self | _topTITLE=textevent=script>说明:在客户端图像映射中描述超链接热点的轮廓形状。
不需要结束标记。
<BCLASS=classnameID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBSSTYLE=css1-propertiesTITLE=textevent=script>说明:将文本以粗体显示。
需要结束标记。
<BASEHREF=urlTARGET=window_name | _blank | _parent | _self | _top>说明:描述文档的基本地址,浏览器依此转换相对地址。
只能用在标记中,不需要结束标记。
<BASEFONTCLASS=classnameCOLOR=colorFACE=fontID=valueLANG=languageSIZE=n>说明:描述基本字体类型,用于显示缺省字体的文本。
可用在标记中,不需要结束标记。
<BGSOUNDBALANCE=nCLASS=classnameID=valueLANG=languageLOOP=nSRC=urlTITLE=textVOLUME=n>说明:在页面中加入背景音乐。
可使用在标记中,结束标记可选。
<BIGCLASS=classnameID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBSSTYLE=css1-propertiesTITLE=textevent=script>说明:以比当前所用字体稍大的字体显示文本。
需要结束标记。
<BLOCKQUOTECLASS=classnameID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBSSTYLE=css1-propertiesTITLE=textevent=script>说明:引用其它资源中的内容,可能会缩进、斜体显示,通常上下加空行。
需要结束标记。
<BODYALINK=colorBACKGROUND=urlBGCOLOR=colorBGPROPERTIES=FIXEDBOTTOMMARGIN=pixelsCLASS=classnameID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBS LEFTMARGIN=pixelsLINK=colorRIGHTMARGIN=pixelsSCROLL=YES|NOSTYLE=css1-propertiesTEXT=colorTITLE=stringTOPMARGIN=nVLINK=colorevent=script>说明:描述文档主体的开始和结束。
需要结束标记。
<BRCLASS=classnameCLEAR=ALL |LEFT | RIGHTID=valueLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBS STYLE=css1-propertiesTITLE=text>说明:换行标记。
<BUTTONACCESSKEY=stringCLASS=classnameDATAFLD=colnameDATAFORMATAS=HTML | TEXTDATASRC=#IDDISABLEDID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBS STYLE=css1-propertiesTITLE=textTYPE=BUTTON | RESET | SUBMITevent=script>说明:设置一个按钮。
需要结束标记。
<CAPTIONALIGN=BOTTOM | CENTER | LEFT | RIGHT | TOP CLASS=classnameID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBS STYLE=css1-propertiesTITLE=textV ALIGN=BOTTOM | TOPevent=script>说明:给加一个标题。
需要结束标记。
<CENTERCLASS=classnameID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBS STYLE=css1-propertiesTITLE=textevent=script>说明:居中排列其中的内容。
需要结束标记。
<CITECLASS=classnameID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBS STYLE=css1-propertiesTITLE=textevent=script>说明:简要说明一个引用,内容用斜体显示。
需要结束标记。
<CODECLASS=classnameID=valueLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBS STYLE=css1-propertiesTITLE=textevent=script>说明:以等宽字体显示一段代码。
需要结束标记。
<COLALIGN=CENTER | LEFT | RIGHTCLASS=classnameID=valueSPAN=nSTYLE=css1-propertiesTITLE=textV ALIGN=BASELINE | BOTTOM | MIDDLE | TOP WIDTH=n>说明:定义中一列的属性。
不需要结束标记。
<COLGROUPALIGN=CENTER | LEFT | RIGHTCLASS=classnameID=valueSPAN=nSTYLE=css1-propertiesTITLE=textV ALIGN=BASELINE | BOTTOM | MIDDLE | TOP WIDTH=n>说明:用于在中定义一个列组。
不需要结束标记。
<COMMENTID=valueLANG=languageTITLE=text>说明:注释标记,不推荐。
建议用。
<DDID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBS STYLE=css1-propertiesTITLE=textevent=script>说明:在列表中解释一条术语,靠右显示。
结束标记可选。
<DELCLASS=classnameID=valueLANG=languageLANGUAGE=JA V ASCRIPT | JSCRIPT | VBSCRIPT | VBS STYLE=css1-propertiesTITLE=textevent=script>说明:指明文本已从文档中删除。