2023年6月20日发(作者：)
HTML是（Hyper Text Markup Language，超文本标记语言）的缩写，用来表示网上信息的符号标记语言，是Web文档的规范。也有人把HTML称为浏览器的母语 。
HTML语言内容丰富，从功能上大体可分为：文本设置、列表建立、文本属性制定、超链接、图片和多媒体插入、对象、表格、表单的操作，以及框架的建立。
Web浏览器按照顺序读取HTML文件，然后根据内容附近的HTML标记来解释和显示各种内容。
2、所有标记都必须用一对尖括号< >括起来，这叫做“定界符”。
3、大部分标记都是成对出现的，包括开始标记和结束标记，二者之间为标记所影响的范围，开始标记和结束标记名称相同，但结束标记总是以一个斜线符号开始，例如： 、
但有一些标记只要求单一标记，例如水平线标记
、换行标记
4、允许标记和属性名使用大写、小写或大小写混合，但建议使用小写。
在HTML里，颜色有两种表示方式。
一种是用颜色名称表示，比如blue表示蓝色;
另外一种是用16进制的数值表示RGB的颜色值。RGB是Red，Green，Blue意思，RGB每个原色的最小值是0，最大值是255，如果换算成16进制表示，就是(#00)，(#FF)。比如白色的RGB(255,255,255)，就用#FFFFFF表示；还有黑色的RGB(0,0,0)，就用#000000表示。
2.1.2 XHTML代码规范介绍
XHTML是可扩展的超文本标记语言，是一种基于XML（可扩展标记语言）应用的HTML，它的可扩展性和灵活性将适应未来Web应用更多的需求。建立XHTML的目的就是实现HTML向XML的过度。
所有标记必须使用相应的结束标记进行关闭
标记及其属性名称必须使用小写字母
标记的属性值必须使用引号括起来
标记的所有属性必须具有值
强制XHTML元素，所有文档都必须文档类型声明
HTML标记
1．HTML文档标记
格式：…标志文件开始和结尾的标记。
2．HTML文件头标记
格式：…用于包含文件的基本信息。
3．HTML文件主体标记
格式：…文件主体标记。
注意：与为独立的两个部分，不能互相嵌套。
标记中的基本内容
1．
2．标记：用来设置文档的格式和所用的字符集，随HTTP协议头进行发送。
其中最重要的设置：
HTTP-EQUIV ：设置或者获取content中的内容，并把内容添加入HTTP的响应头中。
Content：META信息的内容。
举例：
第 1 页 共 7 页
标签中的内容都是在浏览器中可以被看到的内容。除内使用的标签以外的其他HTML语言标签都属于的内容。我们在后续的课程当中主要围绕标签里面的内容来详细讲解。
HTML标记的一般格式：
<标记 属性="值" 属性="值" …>要呈现的内容
<标记 属性="值" 属性="值" … />
例如：
ASP动态网页设计
HTML元素的通用属性：
id：为HTML元素指定一个唯一的标识符。
class：对HTML元素应用CSS类样式。
style：为一个单独出现的元素指定CSS样式
HTML文档的结构：
包括head、title、body三部分。
属性概述:
background＝ ---背景图片
Bgcolor＝“＃RRGGBB” --- 背景色彩
text --- 非可链接文字的色彩（默认文本）
link --- 可链接文字的色彩
alink --- 正被点击的可链接文字的色彩
vlink --- 已经点击(访问)过的可链接文字的色彩
Leftmargin ---页面左边的空白
topmargin ---页面上方的空白
段落标记
P标记用于定义一个段落，该段落与后续内容之间有一个空行,每行的宽度会根据窗口的宽度自动换行。
...
换行标记
用于强制文本换行，但不在行与行之间增加空白，可用于调整行间距
标题标记
HTML中每遇到一个标题，当前段落就会被终止，标题前后会留出一定的空白，文本自动从下一行开始
...
. . .
...
字体标记（字体标记不会自动换行）
size=" intergetOrRelativeSize" color="colorTripletOrName">...
face：字体
size：字号
第 2 页 共 7 页 color：颜色
水平线标记
粗体：...或...
大字体：...
斜体：...或...
小字体：...
删除线：...或...
下标：...
上标：...
下划线：...
创建超链接
使用a标记创建超链接
href：指定要链接的目标资源的URL地址
name：表示网页内的定位点位置，称为锚点
target：指定一个窗口或框架的名称，目标文档将在该窗口或框架中打开( blank self )
title：指定鼠标指向链接时所显示的提示文本
用bgsound标记添加声音
src：指定要播放的声音文件的URL
loop：指定声音播放的次数
通过插件添加声音
loop="true" | "false" |"integer" starttime="mm:ss" endtime="mm:ss"
height="length" width="length" hidden="true" | "flase">
src：指定要播放的声音文件的URL
autostart：指定声音文件是否自动开始播放
loop：指定是否循环播放或播放的次数
pluginspage：指定用户可以从中下载插件的网站的完整URL
heigh和width：分别指定嵌入对象的高度和宽度
在Dreamweaver中，可以通过插入插件的方法在网页中添加声音和视频等媒体内容，此时将自动生成embed标记并对其属性进行设置。
behavior：指定字幕动画的类型
bgcolor：指定字幕的背景颜色。
direction：指定字幕内容的移动方向
height和width：指定字幕的高度和宽度
hspace和vspace：指定字幕的水平边距和垂直边距
loop：指定字幕的滚动次数
scrollamount：指定字幕内容每次移动的像素数
第 3 页 共 7 页 scrolldealy：指定字幕内容两次移动之间的时间间隔
cols：指定框架的列宽，可为像素数（n）、百分比（n%）和相对尺寸（n*）。
rows：指定框架的行高，可为像素数（n）、百分比（n%）和相对尺寸（n*）。
border：指定边框的宽度，以像素为单位。
bordercolor：指定边框的颜色。
frameborder：指定框架周围是否显示三维边框，可取的值有：1、0、no、yes。1或yes表示显示边框；0或no表示不显示边框。默认值为no。
framespacing：指定各框架之间的间隔。
添加按钮
通过input标记定义按钮：
value属性：指定显示在按钮上的标题文本。
type属性：指定按钮的类型，其取值如下。
submit：指定创建一个提交按钮。
reset：指定创建一个重置按钮。
button：指定创建一个自定义按钮。
添加单选按钮
使用input标记创建单选按钮：
name：指定单选按钮的名称。若干个名称相同的单选按钮构成一个相互排斥的单选按钮组，从该组中只能选中一个选项。
value：指定提交表单时单选按钮的值。
checked：指定首次打开表单时该单选按钮处于选中状态
添加复选框
使用input标记定义复选框：
name：指定复选框的名称。
value：指定提交表单时复选框的值。
checked：指定首次打开网页时该复选框处于选中状态。
使用input标记创建隐藏域：
添加文件域
使用input标记创建文件域：
maxlength="characterCount"... />
添加列表框
使用select和option标记创建列表框：
name：指定列表框的名称。
size：指定在列表框中显示的选项行数。
multiple：指定列表框允许做多重选择。
第 4 页 共 7 页 添加标签
使用label标记定义标签：
for：指定与标签关联的表单域的唯一标识符（id属性）。
accesskey：指定单个字符键作为访问键。
tabindex：指示该元素的Tab键顺序。
添加字段集:
使用fieldset和legend标记在表单中添加字段集：
创建滚动字幕
behavior：指定字幕动画的类型
bgcolor：指定字幕的背景颜色。
direction：指定字幕内容的移动方向
height和width：指定字幕的高度和宽度
hspace和vspace：指定字幕的水平边距和垂直边距
loop：指定字幕的滚动次数
scrollamount：指定字幕内容每次移动的像素数
scrolldealy：指定字幕内容两次移动之间的时间间隔
框架网页的基本结构
. . .
设置框架集的属性
第 5 页 共 7 页 cols：指定框架的列宽，可为像素数（n）、百分比（n%）和相对尺寸（n*）。
rows：指定框架的行高，可为像素数（n）、百分比（n%）和相对尺寸（n*）。
border：指定边框的宽度，以像素为单位。
bordercolor：指定边框的颜色。
frameborder：指定框架周围是否显示三维边框，可取的值有：1、0、no、yes。1或yes表示显示边框；0或no表示不显示边框。默认值为no。
framespacing：指定各框架之间的间隔。
在Dreamweaver中，可单击框架集内两个框架之间的分隔线，以选择该框架集，然后利用属性检查器对框架集的属性进行设置。
设置框架的属性
src：指定在该框架中显示的网页。
name属性：指定框架的名称。
border：指定框架边框的宽度。
bordercolor：指定边框的颜色。
frameborder：指定框架周围是否显示边框，其取值可以是：1或yes（显示边框）、0或no（不显示边框）。
frameheight：指定框架内容与上下边框的间距。
framewidth：指定框架内容与左右边框的间距。
scrolling：指定是否为框架添加滚动条，其取值可以是：yes（添加）、no（不添加）或auto（在需要时自动添加）。
noresize：不能调整框架的大小。
在Dreamweaver中，可按住Alt键同时单击一个框架，以选择该框架，然后利用属性检查器对该框架的属性进行设置。
插入表单
name：指定表单的名称
method：指定发送表单的HTTP方法（post，get）
action：指定提交表单时将被访问的URL
enctype：指定提交到服务器表单数据的MIME编码类型
target：指定用来显示表单处理结果的窗口或框架
其中 type用来设置表单的类型
name用来标识此标签名称
value则是此提交到服务器上的值
type类型
1）text类型 2）password类型
3）radio类型 4）checkbox类型
5）submit类型 6）reset类型
7）hidden类型 8) File
9) Image 10) button
第 6 页 共 7 页
添加按钮
通过input标记定义按钮：
value属性：指定显示在按钮上的标题文本。
type属性：指定按钮的类型，其取值如下。
submit：指定创建一个提交按钮。
reset：指定创建一个重置按钮。
button：指定创建一个自定义按钮。
在Dreamweaver中插入按钮：
选择【插入】→【表单】→【按钮】命令
在插入栏的【表单】类别中单击【按钮】按钮。
添加单选按钮
使用input标记创建单选按钮：
name：指定单选按钮的名称。若干个名称相同的单选按钮构成一个相互排斥的单选按钮组，从该组中只能选中一个选项。
value：指定提交表单时单选按钮的值。
checked：指定首次打开表单时该单选按钮处于选中状态
在Dreamweaver中添加单选按钮：
选择【插入】→【表单】→【单选按钮】命令
在插入栏的【表单】类别中单击【单选按钮】按钮。
添加标签
使用label标记定义标签：
for：指定与标签关联的表单域的唯一标识符（id属性）。
accesskey：指定单个字符键作为访问键。
tabindex：指示该元素的Tab键顺序。
在Dreamweaver中添加标签：
单击插入栏的【表单】类别中【标签】按钮
第 7 页 共 7 页
2023年6月20日发(作者：)
HTML是（Hyper Text Markup Language，超文本标记语言）的缩写，用来表示网上信息的符号标记语言，是Web文档的规范。也有人把HTML称为浏览器的母语 。
HTML语言内容丰富，从功能上大体可分为：文本设置、列表建立、文本属性制定、超链接、图片和多媒体插入、对象、表格、表单的操作，以及框架的建立。
Web浏览器按照顺序读取HTML文件，然后根据内容附近的HTML标记来解释和显示各种内容。
2、所有标记都必须用一对尖括号< >括起来，这叫做“定界符”。
3、大部分标记都是成对出现的，包括开始标记和结束标记，二者之间为标记所影响的范围，开始标记和结束标记名称相同，但结束标记总是以一个斜线符号开始，例如： 、
但有一些标记只要求单一标记，例如水平线标记
、换行标记
4、允许标记和属性名使用大写、小写或大小写混合，但建议使用小写。
在HTML里，颜色有两种表示方式。
一种是用颜色名称表示，比如blue表示蓝色;
另外一种是用16进制的数值表示RGB的颜色值。RGB是Red，Green，Blue意思，RGB每个原色的最小值是0，最大值是255，如果换算成16进制表示，就是(#00)，(#FF)。比如白色的RGB(255,255,255)，就用#FFFFFF表示；还有黑色的RGB(0,0,0)，就用#000000表示。
2.1.2 XHTML代码规范介绍
XHTML是可扩展的超文本标记语言，是一种基于XML（可扩展标记语言）应用的HTML，它的可扩展性和灵活性将适应未来Web应用更多的需求。建立XHTML的目的就是实现HTML向XML的过度。
所有标记必须使用相应的结束标记进行关闭
标记及其属性名称必须使用小写字母
标记的属性值必须使用引号括起来
标记的所有属性必须具有值
强制XHTML元素，所有文档都必须文档类型声明
HTML标记
1．HTML文档标记
格式：…标志文件开始和结尾的标记。
2．HTML文件头标记
格式：…用于包含文件的基本信息。
3．HTML文件主体标记
格式：…文件主体标记。
注意：与为独立的两个部分，不能互相嵌套。
标记中的基本内容
1．
2．标记：用来设置文档的格式和所用的字符集，随HTTP协议头进行发送。
其中最重要的设置：
HTTP-EQUIV ：设置或者获取content中的内容，并把内容添加入HTTP的响应头中。
Content：META信息的内容。
举例：
第 1 页 共 7 页
标签中的内容都是在浏览器中可以被看到的内容。除内使用的标签以外的其他HTML语言标签都属于的内容。我们在后续的课程当中主要围绕标签里面的内容来详细讲解。
HTML标记的一般格式：
<标记 属性="值" 属性="值" …>要呈现的内容
<标记 属性="值" 属性="值" … />
例如：
ASP动态网页设计
HTML元素的通用属性：
id：为HTML元素指定一个唯一的标识符。
class：对HTML元素应用CSS类样式。
style：为一个单独出现的元素指定CSS样式
HTML文档的结构：
包括head、title、body三部分。
属性概述:
background＝ ---背景图片
Bgcolor＝“＃RRGGBB” --- 背景色彩
text --- 非可链接文字的色彩（默认文本）
link --- 可链接文字的色彩
alink --- 正被点击的可链接文字的色彩
vlink --- 已经点击(访问)过的可链接文字的色彩
Leftmargin ---页面左边的空白
topmargin ---页面上方的空白
段落标记
P标记用于定义一个段落，该段落与后续内容之间有一个空行,每行的宽度会根据窗口的宽度自动换行。
...
换行标记
用于强制文本换行，但不在行与行之间增加空白，可用于调整行间距
标题标记
HTML中每遇到一个标题，当前段落就会被终止，标题前后会留出一定的空白，文本自动从下一行开始
...
. . .
...
字体标记（字体标记不会自动换行）
size=" intergetOrRelativeSize" color="colorTripletOrName">...
face：字体
size：字号
第 2 页 共 7 页 color：颜色
水平线标记
粗体：...或...
大字体：...
斜体：...或...
小字体：...
删除线：...或...
下标：...
上标：...
下划线：...
创建超链接
使用a标记创建超链接
href：指定要链接的目标资源的URL地址
name：表示网页内的定位点位置，称为锚点
target：指定一个窗口或框架的名称，目标文档将在该窗口或框架中打开( blank self )
title：指定鼠标指向链接时所显示的提示文本
用bgsound标记添加声音
src：指定要播放的声音文件的URL
loop：指定声音播放的次数
通过插件添加声音
loop="true" | "false" |"integer" starttime="mm:ss" endtime="mm:ss"
height="length" width="length" hidden="true" | "flase">
src：指定要播放的声音文件的URL
autostart：指定声音文件是否自动开始播放
loop：指定是否循环播放或播放的次数
pluginspage：指定用户可以从中下载插件的网站的完整URL
heigh和width：分别指定嵌入对象的高度和宽度
在Dreamweaver中，可以通过插入插件的方法在网页中添加声音和视频等媒体内容，此时将自动生成embed标记并对其属性进行设置。
behavior：指定字幕动画的类型
bgcolor：指定字幕的背景颜色。
direction：指定字幕内容的移动方向
height和width：指定字幕的高度和宽度
hspace和vspace：指定字幕的水平边距和垂直边距
loop：指定字幕的滚动次数
scrollamount：指定字幕内容每次移动的像素数
第 3 页 共 7 页 scrolldealy：指定字幕内容两次移动之间的时间间隔
cols：指定框架的列宽，可为像素数（n）、百分比（n%）和相对尺寸（n*）。
rows：指定框架的行高，可为像素数（n）、百分比（n%）和相对尺寸（n*）。
border：指定边框的宽度，以像素为单位。
bordercolor：指定边框的颜色。
frameborder：指定框架周围是否显示三维边框，可取的值有：1、0、no、yes。1或yes表示显示边框；0或no表示不显示边框。默认值为no。
framespacing：指定各框架之间的间隔。
添加按钮
通过input标记定义按钮：
value属性：指定显示在按钮上的标题文本。
type属性：指定按钮的类型，其取值如下。
submit：指定创建一个提交按钮。
reset：指定创建一个重置按钮。
button：指定创建一个自定义按钮。
添加单选按钮
使用input标记创建单选按钮：
name：指定单选按钮的名称。若干个名称相同的单选按钮构成一个相互排斥的单选按钮组，从该组中只能选中一个选项。
value：指定提交表单时单选按钮的值。
checked：指定首次打开表单时该单选按钮处于选中状态
添加复选框
使用input标记定义复选框：
name：指定复选框的名称。
value：指定提交表单时复选框的值。
checked：指定首次打开网页时该复选框处于选中状态。
使用input标记创建隐藏域：
添加文件域
使用input标记创建文件域：
maxlength="characterCount"... />
添加列表框
使用select和option标记创建列表框：
name：指定列表框的名称。
size：指定在列表框中显示的选项行数。
multiple：指定列表框允许做多重选择。
第 4 页 共 7 页 添加标签
使用label标记定义标签：
for：指定与标签关联的表单域的唯一标识符（id属性）。
accesskey：指定单个字符键作为访问键。
tabindex：指示该元素的Tab键顺序。
添加字段集:
使用fieldset和legend标记在表单中添加字段集：
创建滚动字幕
behavior：指定字幕动画的类型
bgcolor：指定字幕的背景颜色。
direction：指定字幕内容的移动方向
height和width：指定字幕的高度和宽度
hspace和vspace：指定字幕的水平边距和垂直边距
loop：指定字幕的滚动次数
scrollamount：指定字幕内容每次移动的像素数
scrolldealy：指定字幕内容两次移动之间的时间间隔
框架网页的基本结构
. . .
设置框架集的属性
第 5 页 共 7 页 cols：指定框架的列宽，可为像素数（n）、百分比（n%）和相对尺寸（n*）。
rows：指定框架的行高，可为像素数（n）、百分比（n%）和相对尺寸（n*）。
border：指定边框的宽度，以像素为单位。
bordercolor：指定边框的颜色。
frameborder：指定框架周围是否显示三维边框，可取的值有：1、0、no、yes。1或yes表示显示边框；0或no表示不显示边框。默认值为no。
framespacing：指定各框架之间的间隔。
在Dreamweaver中，可单击框架集内两个框架之间的分隔线，以选择该框架集，然后利用属性检查器对框架集的属性进行设置。
设置框架的属性
src：指定在该框架中显示的网页。
name属性：指定框架的名称。
border：指定框架边框的宽度。
bordercolor：指定边框的颜色。
frameborder：指定框架周围是否显示边框，其取值可以是：1或yes（显示边框）、0或no（不显示边框）。
frameheight：指定框架内容与上下边框的间距。
framewidth：指定框架内容与左右边框的间距。
scrolling：指定是否为框架添加滚动条，其取值可以是：yes（添加）、no（不添加）或auto（在需要时自动添加）。
noresize：不能调整框架的大小。
在Dreamweaver中，可按住Alt键同时单击一个框架，以选择该框架，然后利用属性检查器对该框架的属性进行设置。
插入表单
name：指定表单的名称
method：指定发送表单的HTTP方法（post，get）
action：指定提交表单时将被访问的URL
enctype：指定提交到服务器表单数据的MIME编码类型
target：指定用来显示表单处理结果的窗口或框架
其中 type用来设置表单的类型
name用来标识此标签名称
value则是此提交到服务器上的值
type类型
1）text类型 2）password类型
3）radio类型 4）checkbox类型
5）submit类型 6）reset类型
7）hidden类型 8) File
9) Image 10) button
第 6 页 共 7 页
添加按钮
通过input标记定义按钮：
value属性：指定显示在按钮上的标题文本。
type属性：指定按钮的类型，其取值如下。
submit：指定创建一个提交按钮。
reset：指定创建一个重置按钮。
button：指定创建一个自定义按钮。
在Dreamweaver中插入按钮：
选择【插入】→【表单】→【按钮】命令
在插入栏的【表单】类别中单击【按钮】按钮。
添加单选按钮
使用input标记创建单选按钮：
name：指定单选按钮的名称。若干个名称相同的单选按钮构成一个相互排斥的单选按钮组，从该组中只能选中一个选项。
value：指定提交表单时单选按钮的值。
checked：指定首次打开表单时该单选按钮处于选中状态
在Dreamweaver中添加单选按钮：
选择【插入】→【表单】→【单选按钮】命令
在插入栏的【表单】类别中单击【单选按钮】按钮。
添加标签
使用label标记定义标签：
for：指定与标签关联的表单域的唯一标识符（id属性）。
accesskey：指定单个字符键作为访问键。
tabindex：指示该元素的Tab键顺序。
在Dreamweaver中添加标签：
单击插入栏的【表单】类别中【标签】按钮
第 7 页 共 7 页
![html手写代码[整理版]](/uploads/image/0198.jpg)
发布评论