html基本标签元素
css之html标签中常见的的inline、inline-block、block元素
css之html标签中常见的的inline、inline-block、block元素HTML中常见的inline、inline-block、block元素display常⽤属性值none：隐藏对象。
与visibility属性的hidden值不同，其不为被隐藏的对象保留其物理空间inline：内联元素inline-block：内联块级元素block：块元素flex：弹性盒display:none与visibility:hidden的区别浏览器渲染的时候会涉及到重绘与回流的问题，前者隐藏后脱离⽂档流，不占据页⾯空间引发回流。
后者隐藏后还占⽤空间，只引起重绘。
因此优化的时候会有那么⼀条：建议⽤visibility:hidden替换display:none另外，vue中的v-show指令，切换的就是元素的display样式inline特点内联元素会在⼀条直线上排列，在同⼀⾏从左⾄右⽔平排列。
直到⼀⾏排不下，才会换⾏。
内联元素设置宽、⾼、margin和padding的上下⽆效（竖直⽆效）。
内联元素设置line-height，margin左右和padding的左右有效（⽔平有效）。
内联元素的宽⾼随标签⾥的内容⽽变化。
block 特点独占⼀⾏，多个block元素另起⼀⾏，默认情况下，block元素宽度⾃动填满其⽗元素宽度block元素可以设置width,height属性。
块元素即使设置了宽度,仍然是独占⼀⾏。
block元素可以设置margin和padding属性。
inline-block 特点#让block元素不再独占⼀⾏，多个block元素可以同排⼀⾏，且元素具有block的属性，可设置宽⾼常见块内元素<header></header><nav></nav><address></address><footer></footer><form></form><div></div><p></p><h></h><hr/><ul></ul><ol></ol><li></li><dl></dl><tr></tr><td></td><table></table><pre></pre><blockquote></blockquote>常见⾏内元素<a></a><span></span><textarea></textarea><br/><b></b><del></del><em></em><i></i><strong></strong><sup></sup><sub></sub>⾏内块级元素<img/>、<input/>、<select></select>。
简述html的常用标签及其作用
简述html的常用标签及其作用HTML（Hypertext Markup Language）是用于创建网页的标准标记语言，它使用标签来定义网页的结构和内容。
以下是HTML中一些常用的标签及其作用：1. `<html>`：定义HTML文档的根元素。
2. `<head>`：定义文档的头部内容，包括页面的标题、字符编码等。
3. `<title>`：定义文档的标题，显示在浏览器的标题栏或标签上。
4. `<body>`：定义文档的主体部分。
5. `<h1>` - `<h6>`：定义标题，根据重要性和级别递减。
6. `<p>`：定义段落。
7. `<a>`：定义超链接，用于链接到其他页面或文档。
8. `<img>`：定义图像，用于在网页中显示图片。
9. `<ul>`：定义无序列表。
10. `<ol>`：定义有序列表。
11. `<li>`：定义列表项。
12. `<div>`：定义文档中的分割或部分。
用于组织网页布局。
13. `<span>`：定义文本的行内元素容器，用于设置特定部分的样式。
14. `<table>`：定义表格。
15. `<tr>`：定义表格的行。
16. `<td>`：定义表格的单元格。
17. `<form>`：定义表单，用于收集用户输入的数据。
18. `<input>`：定义表单中的输入字段。
19. `<textarea>`：定义表单中的多行文本输入字段。
20. `<button>`：定义按钮。
21. `<select>`：定义下拉列表。
22. `<option>`：定义下拉列表中的选项。
23. `<label>`：定义表单元素的标签。
HTML基础知识（块级标签，行内标签，行内块标签）
HTML基础知识（块级标签，⾏内标签，⾏内块标签）块级元素：独占⼀⾏，对宽⾼的属性值⽣效；如果不给宽度，块级元素就默认为浏览器的宽度，即就是100%宽；⾏内元素：可以多个标签存在⼀⾏，对宽⾼属性值不⽣效，完全靠内容撑开宽⾼！其中还有⼀种结合两种模式有点的显⽰模式：⾏内块元素：结合的⾏内和块级的有点，不仅可以对宽⾼属性值⽣效，还可以多个标签存在⼀⾏显⽰；⾏内标签：包含a、span、em、strong、b、i、u、label、br；特点：可以多个标签存在⼀⾏，不能直接设置⾏内标签的⾼度、宽度、⾏⾼以及顶和底边距，完全靠内容撑开宽⾼！a标签：主要⽤来链接⼀个其他的⽹页；span标签：主要⽤来对⾏内的⽂字进⾏⼀些样式以及其他的操作；em标签：⼀般⽤来对⽂字进⾏强调，使⽤斜体体现出来；strong标签：⼀般⽤来对⽂字进⾏强调，使⽤加粗字体体现出来；img标签：图⽚引⽤标签，其中 src属性中写⼊图⽚的地址；var标签：JavaScript中命名变量的标签。
块标签：包含p、div、ul、ol、li、dl、dt、dd、h1~h6、form；特点：独占⼀⾏，对⾼度、宽度、⾏⾼以及顶和底边距都可设置的属性值⽣效；如果不给宽度，块级元素就默认为浏览器的宽度，即就是100%宽；p标签：段落标签，段落⽂字使⽤，默认格式：段尾进⾏换⾏；div标签：划分块的主要使⽤标签；ul标签：⽆序列表的主标签，后⾯的标号为圆点（⿊⾊）；ol标签：有序列表的主标签，后⾯⼀般跟有序的1,2,3,4,5...；li标签：列表中的主体使⽤标签dl标签：⾃定义标签的主标签；dt标签：⾃定义标签的表头；dd标签：⾃定义标签的表头的解释（描述）信息；h1~h6：6级标题标签、字体的⼤⼩依次变⼩。
⾏内块标签：img,input,textarea特点：结合的⾏内和块级的有点，不仅可以对宽⾼属性值⽣效，还可以多个标签存在⼀⾏显⽰；+++++++++++++++++++++++++++++++++++++++++各种标签之间的转换1、块级标签转换为⾏内标签：display:inline;2、⾏内标签转换为块级标签：display:block;3、转换为⾏内块标签：display：inline-block;各个标签之间的区别块标签：独⾃占领⼀⾏、可以进⾏宽⾼的数值的设定；⾏标签：在⼀⾏内显⽰、不可以进⾏宽⾼的数值设定；⾏内块标签：能和其他元素待在⼀⾏，能设置宽⾼；嵌套规则块标签可以套⾏标签，⾏标签不可以套块标签。
html5的基本标签
html5的基本标签HTML5的基本标签包括：1. `<html>`：定义HTML文档的根元素。
2. `<head>`：包含了文档的元数据信息，例如标题、字符编码等。
3. `<body>`：包含了文档的可见内容。
4. `<h1>` - `<h6>`：定义标题，从最高级的标题`<h1>`到最低级的标题`<h6>`。
5. `<p>`：定义段落。
6. `<a>`：定义超链接。
7. `<img>`：定义图像。
8. `<ul>`和`<li>`：定义无序列表和列表项。
9. `<ol>`和`<li>`：定义有序列表和列表项。
10. `<div>`：定义文档中的一个分区或节。
11. `<span>`：定义文档中的一个行内区域。
12. `<form>`：定义用户输入表单。
13. `<input>`：定义表单中的输入字段。
14. `<button>`：定义按钮。
15. `<table>`、`<tr>`、`<td>`：定义表格及其行、单元格。
16. `<video>`：定义视频。
17. `<audio>`：定义音频。
18. `<canvas>`：定义画布，用于绘制图形、动画等。
19. `<header>`：定义文档或节的页眉。
20. `<footer>`：定义文档或节的页脚。
以上只是HTML5的部分基本标签，还有很多其他标签可以用于创建和定义不同的元素和内容。
HTML重要标签总结归纳
HTML 重要标签： (1)样式/节 ①<style> 实例：<html> <head><style type=”text/css”> h1 { color:red } p { color:blue } </style></head> <body><h1>Header 1</h1> <p>A paragraph.</p></body></html>定义和用法<style> 标签用于为 HTML 文档定义样式信息。
在 style 中，您可以规定在浏览器中如何呈现 HTML 文档。
type 属性是必需的，定义 style 元素的内容。
唯一可能的值是 "text/css"。
style 元素位于 head 部分中。
②<div>HTML <div> 元素是块级元素，它是可用于组合其他 HTML 元素的容器。
<div> 元素没有特定的含义。
除此之外，由于它属于块级元素，浏览器会在其前后显 示折行。
如果与 CSS 一同使用，<div> 元素可用于对大的内容块设置样式属性。
<div> 元素的另一个常见的用途是文档布局。
它取代了使用表格定义布局的老式方法。
使用 <table> 元素进行文档布局不是表格的正确用法。
<table> 元素的作用是显示 表格化的数据。
实例：<html><body> <h3>This is a header</h3><p>This is a paragraph.</p> <div style="color:#00FF00"><h3>This is a header</h3><p>This is a paragraph.</p></div> </body></html>定义和用法 <div> 可定义文档中的分区或节（division/section）。
HTML基本标签
XHTML代码规范
（1）所有标签和属性的名字都必须使用小写； （2）所有标签都有一个相应的结束标签； （3）属性值必须加双引号； （4）显式定义属性值； （5）标签合理嵌套；
文本相关标签
文本相关标签
标题 文字缩进
字体标签
字体标签
…… <h2 align="center">如何加入“消费者保障服务”？ 差点忘了，缩进还 </h2> 字体加了颜色 没实现呢？ <p><font face=“宋体" size="2" color="#ff8424"> 您可以通过“我的淘宝”->“我是卖家”->“消费者保障服 务”申请加入。</font> </p> 字体名称 …… 字体尾标签
为什么要使用段落标签和换行标签
<html> 小新写的代码 <head> <title>淘宝网</title> </head> <body> <h2 align="center">如何加入“消费者保障服务”？</h2> 您可以通过“我的淘宝”->“我是卖家”->“消费者保障服务”申请 加入。在申请加入之前请先确认自己是否符合加入消费者保障服务的条 文字缩进 我也换行了 件，如果符合申请要求，您可以点击“申请加入”按钮提交申请。 然后进入“选择服务”页面，选择服务后点击“下一步”： 进入“阅读协议”页面，阅读后点击“同意以上协议，申请加入”，即 可看到申请成功，等待审核通知页面。 ………… </body> 我分段换行了哟 天啊！不是在HTML文档里排版分 </html> 段换行了吗，结果怎么都走了样？
html行级元素和块级元素标签列表分别有哪些
html⾏级元素和块级元素标签列表分别有哪些⾏内元素列表:<a>标签可定义锚<abbr>表⽰⼀个缩写形式<acronym>定义只取⾸字母缩写<b>字体加粗<bdo>可覆盖默认的⽂本⽅向<big>⼤号字体加粗<br>换⾏<cite>引⽤进⾏定义<code>定义计算机代码⽂本<dfn>定义⼀个定义项⽬<em>定义为强调的内容<i>斜体⽂本效果<img>向⽹页中嵌⼊⼀幅图像<input>输⼊框<kbd>定义键盘⽂本<label>标签为<input> 元素定义标注（标记）<q>定义短的引⽤<samp>定义样本⽂本<select>创建单选或多选菜单<small>呈现⼩号字体效果<span>组合⽂档中的⾏内元素<strong>语⽓更强的强调的内容<sub>定义下标⽂本<sup>定义上标⽂本<textarea>多⾏的⽂本输⼊控件<tt>打字机或者等宽的⽂本效果<var>定义变量块级元素列表:<address>定义地址<caption>定义表格标题<dd>定义列表中定义条⽬<div>定义⽂档中的分区或节<dl>定义列表<dt>定义列表中的项⽬<fieldset>定义⼀个框架集<form>创建 HTML 表单<h1>定义最⼤的标题<h2>定义副标题<h3>定义标题<h4>定义标题<h5>定义标题<h6>定义最⼩的标题<hr>创建⼀条⽔平线<legend>元素为<fieldset>元素定义标题<li>标签定义列表项⽬<noframes>为那些不⽀持框架的浏览器显⽰⽂本，于 frameset 元素内部<noscript>定义在脚本未被执⾏时的替代内容<ol>定义有序列表<ul>定义⽆序列表<p>标签定义段落<pre>定义预格式化的⽂本<table>标签定义 HTML 表格<tbody>标签表格主体（正⽂）<td>表格中的标准单元格<tfoot>定义表格的页脚（脚注或表注）<th>定义表头单元格<thead>标签定义表格的表头<tr>定义表格中的⾏。
一、HTML中常用标签及属性
⼀、HTML中常⽤标签及属性⼀、HTML基础语法 ---> 单标签、双标签、块级元素、⾏内元素 单双标签其实就是HTML⽂档中标签书写的格式，页⾯中最常见的是双标签； 单标签就是只有⼀个标签，也就是⼀个空元素：meta、img、hr、br 双标签有开始标签和结束标签 块级元素：独占⼀⾏，对宽⾼的属性值⽣效，如果不给宽度，块级元素就默认浏览器的宽度，（即就是100%宽） 例如：div p ul h1~h6 ..... ⾏内元素：对宽⾼属性值不⽣效，完全靠内容撑开宽⾼，可以跟其他标签存在⼀⾏ 例如：span b strong em a img input ...... ⾏内块元素：结合⾏内和块级元素的特点，不仅对宽⾼的属性值⽣效，还可以跟多个标签存在⼀⾏ 例如：input img⼆、HTML中常⽤标签 ---> ⽂档头部<!DOCTYPE html><!-- 申明，这⾏以下的⽂档都是html⽂档 --><html lang="en"><head><!-- 设置字符集编码 --><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><!-- 定义⽹页头部 --><title>Document</title><!-- link标签引⼊外部⽂件 rel定义⽂档与被链接⽂档的关系 shortcut icon:链接图⽚ type规定链接⽂档的类型 image/x-icon 图⽚类型 --><link rel="shortcut icon" type="image/x-icon" href=""><!-- link标签引⼊外部⽂件 rel定义⽂档与被链接⽂档的关系 stylesheet:层叠样式表 type规定链接⽂档的类型 text/css CSS样式表 --><link rel="stylesheet" type="text/css" href=""></head><body></body></html>三、HTML中常⽤标签 ---> ⽂本标签级属性<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><!-- 块级元素，段落标签 text-indent:段落缩进 1个em就是1个字体的长度; --><!-- font-size:字体⼤⼩设置 1px⼀个像素点⼤⼩;color:字体颜⾊;font-weight:bold 字体加粗;font-family:字体类型 --><p style="text-indent: 2em;font-size:15px;color: red;font-weight: bold;font-family: monospace;"></p><!-- ************ --><!-- ⾏内元素标签 --><!-- 斜体标签1 --><em></em><!-- 斜体标签2 --><i></i><!-- 删除线标签 --><del></del><span></span><!-- ************ --><!-- 换⾏标签，单标签，内部没有属性，上⾯的段落、⾏内标签可以通过br换⾏ --><br><!-- 预格式标签，保留⽂本中的换⾏或者空格 --><pre></pre><!-- 标题标签，h1~h6，块级元素，从⼤到⼩，h1最⼤ --><!-- text-align:设置⽂本位置 left:靠左 center:居中 right:靠右 --><h1 style="text-align: center;"></h1><!-- background:背景颜⾊ height:标签⾼度 line-height:设置⾏⾼ --><h2 style="background: pink;height: 50px;line-height: ;"></h2><h3></h3><h4></h4><h5></h5><h6></h6></body></html>四、HTML中常⽤标签 ---> 超链接<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style type="text/css">/* 去掉a链接下划线 */a{text-decoration: none;}/* 伪属性，⿏标移上字体变红,下划线显⽰ */a:hover{color: red;text-decoration: underline;}div{height: 1000px;background: pink;width:400px;}</style></head><body><!-- 链接标签 href:链接地址，"#"本页⾯跳转，默认⾃带下划线 --><a href="#">我是⼀个链接</a><!-- 图⽚链接 --><a href=""><img src="" alt=""></a><!-- 设置锚点定位 --><a href="top">页⾯顶部</a><div></div><a href="" id="top">回到顶部</a></body></html>五、HTML中常⽤标签 ---> 列表标签<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>列表标签</title><style type="text/css">/* 清空li样式；⽂化素质宽⾼；设置边框线 */ul li{list-style: none;height: 40px;width: 200px;border: 1px solid #ccc;margin: 5px 0px;text-align:center;line-height: 40px;} /* 设置前⾯样式为图⽚，但是⽆法调整图⽚与⽂字的间距 */ul li{list-style: url(图⽚地址);}/* 伪元素；在⽂字前⾯设置图⽚与⽂字的间距 */ul li::before{content: url(图⽚地址);margin-right: 30px;}/* 伪元素；在⽂字前⾯设置图⽚与⽂字的间距 */ul li::after{content: url(图⽚地址);}</style></head><body><!-- 有序列表 --><ol><li>web前端</li><li>JavaScript</li><li>jQuery</li></ol><!-- ⽆序列表 --><ul><li>西⽠<ul><li>有籽西⽠</li><li>⽆籽西⽠</li></ul></li><li>苹果</li><li>西柚</li></ul></body></html>六、HTML中常⽤标签 ---> form表单<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>form表单</title><style type="text/css">/* padding内边距 */input{height: 8px;width: 258px;border: 1px solid #ccc;margin-top: 20px;padding: 20px;} /* border: none去掉按钮⾃带的边框线 */button{height: 50px;width: 300px;margin-top: 20px;background: #FF6A00;border: none;color: #fff;} </style></head><body><!-- method在后端传输数据⽤到,传值⽅式get/post --><!-- action传值url地址 --><form method="" action=""><!-- type类型，输⼊域的类型：text⽂本型，password密码类型 --><!-- placeholder⽂本框内部的提⽰信息 --><input type="text" name="username" placeholder="请输⼊⽤户名"><br><input type="password" name="pwd" placeholder="请输⼊⽤密码"><br><button>登陆</button></form></body></html>七、HTML中常⽤标签 ---> 表格（table）<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>表格</title><style type="text/css">/* 清除默认样式 */*{margin: 0px;padding: 0px;}/* border-collapse: collapse;合并多余的边框线 */table{border: 1px solid #ccc;border-collapse: collapse;}tr th{height: 200px;border: 1px solid #ccc;width: 100px;}tr td{height: 200px;border: 1px solid #ccc;width: 100px;}</style></head><body><table><!-- 表头定义⽤th --><tr><th>1</th><th>2</th><th>3</th><th>4</th><th>5</th></tr><!-- 定义⾏⽤tr --><tr><!-- 定义列⽤td --><!-- colspan="5"合并5列 --><td colspan="5"></td></tr><tr><!-- 定义列⽤td --><!-- rowspan="2"合并两⾏，同时删除合并⾏的列 --><td rowspan="2"></td><td></td><td></td><td></td><td></td></tr><tr><td></td><td></td><td></td><td></td></tr></table></body></html>。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
试验2 常用HTML标签使用实验目的：使用HTML标签熟练编写静态页面。
由于所选教材未涉及这部分内容，此处列出常用的标签。
详细的标记用法请参考网站：/html/index.asp1. 文件标记(1) <html></html><html>标记表示HTML文件从此处开始，到</html>标记结束，这对标记处在最外层，网页的内容写在此标记内。
(2) <head></head>这对标记表示此处是HTML文档的文件头。
文件头内部的信息一般不会在浏览器的正文区显示。
此标记对内可以插入其他标记，如网页标题标记<title></title>。
(3) <body></body>这对标记表示此处是网页的主体，一般不能省略，标记体的内容在浏览器正文区中显示，例如文字、图片和超链接等。
2．排版标记(1) <!-- -->标记<!-- -->标记在HTML文件中作注释用，对网页中的代码作说明，可以放在网页中的任何位置。
注释内容会返回到客户端浏览器上，但不显示。
例如在浏览器中输入，查看源文件可以看到此类注释。
(2) <p></p><p></p>标记对用于标示一个段落，两个相邻的段落间有一空行的间隔。
(3) <br>这个标记没有结束标记，表示换行。
<p></p>标记和<br>都能换行，但<br>换行后，上下两行的间距比较小，<p></p>标记换行后，上下两行有一空行的间距。
3．字体标记字体标记包括<STRONG>，<B>，<EM>，<I>，<FONT>等。
<font>标记用于定义字体、字号大小和颜色。
<font>标记的主要属性有face、size、color。
face属性用于设置字体，如：<font face=“宋体”>。
size属性用于设置字号，HTML中定义了7种字号，1号最小，7号最大，如：<font size=“4”>。
字号也可以用“磅”(px)表示。
color属性用于设置文本的颜色，color有三种方法来设定颜色，第一种方法用颜色名称，第二种方法用红、绿、蓝百分比的值来设定，第三种方法是用16进制的颜色代号还设定颜色。
如：<FONT COLOR=”RED”>红色字体设置</FONT><FONT COLOR=”RGB(70%，10%，30%)”>颜色设置</FONT><FONT COLOR=”#EF0000”>颜色设定</FONT>4．表格标记在网页中，表格主要分成排版表格和数据表格两种。
排版表格在浏览器中不显示边线，仅供排版、布局用。
数据表格在浏览器中显示边线或背景色，用于列表显示数据。
<table>标记表示表格的开始，</table>表示表格到此结束。
<tr></tr>表示表格中的一行。
<table></table>间如有n对<tr></tr>标记，表示此表格有n行。
<td></td>表示一行中的一列，一般写在<tr></tr>内。
<table>、<tr>、<td>间的嵌套关系为：<table><tr><td></td></tr></table>5．表单表单时系统和用户交互的重要手段。
用户在表单中填写数据，提交后，表单中的数据传递给后台程序处理，实现了客户端和服务器的交互。
(1)<form></form>标记<form>和</form>标记表示表单的开始和结束。
在表单标记中可以存放各种表单元素，如文本域、按钮等。
一个表单元素相当于一个变量，它的取值相当于变量的取值。
<form>标记中的id和name属性均为表单的ID名，用于在当前网页中标识表单，在当前网页中此ID名应该唯一。
<form>中action属性值为后台表单处理程序的URI。
<form>标记中的method属性标识数据的提交方式，一般有GET和POST两种方式。
GET方式将表单中的数据按照“变量名=变量值”的形式附加在URL的查询串中，各个变量之间使用“&”连接。
如：http://127.0.0.1:8080/exam.jsp?name=user1(2)文本域标记文本域表单的常见用法如下：<input name=”name” type=”text” id=”name” value=”123”/><input>标记表示此标记是写人标记，存储用户写入的信息。
标记中的id和name属性为文本域的ID名，type属性表示此写入标记的类型，value属性存储文本域的值。
多行文本框用文本域表单元素实现，它的HTML标记使用格式如下：<textarea name=”context”>内容说明</textarea>Name属性是文本区域的名字。
由于多行文本框可以输入较多的内容，所以把写入的内容存储在标记中。
(3)单选按钮标记在实际应用中的“性别”信息一班通过单选按钮采集，用户在给定的“男”和“女”两个选项中选择其中一个，相应的HTML代码如下：<input name=”sex” type=”radio” value=”男” checked=”checked”/><input name=”sex“ type=”radio” value=”女”/><input>标记中的type=”radio”属性表示此写入标记为单选按钮类型。
name=”sect”定义表单元素的名称，这两个单选按钮属于同一组，它们name属性的取值均为”sex”，称之为“同名单选表单”。
同一组的单选按钮具有互斥性，即只能是多选一操作。
value=”男”属性为单选按钮的取值，同组中的各单选按钮name属性值相同(同名)，但value属性值不能相同(不同值)。
checked=”checked”表示当前此单选按钮被选中。
(4)复选钮标记在实际应用的“爱好”信息一般通过复选按钮采集，用户在列出的多个爱好中做出选择，可以选零个，也可以全选，相应的HTML代码如下：<input name=”hobby” type=”checkbox” id=”hobby” value=”篮球”/><input name=”hobby” type=”checkbox” id=”hobby” value=”羽毛球”/><input name=”hobby” type=”checkbox” id=”hobby” value=”排球”/><input name=”hobby” type=”checkbox” id=”hobby” value=”足球”/><input>标记中的type=”checkbox”属性表示此表单元素的类型为复选按钮。
name和id属性均为复选按钮的名称，这4个复选按钮同属于“爱好”组，它们的name和id值均为“hobby”（同名表单）。
value=”篮球”属性为复选按钮的值，同一组中不同复选按钮的value属性值不同。
(5)隐藏表单域列表表单元素预先把一组可供选择的数据存储在列表中，以下拉菜单或列表的形式供用户在其中选择，其中name是选项的提示文字，value才是选项的值。
它的HTML 代码如下：<input name=”loginname” type=”hidden” id=”loginname” value=”zhukai”/> (6)列表表单元素列表表单元素预先把一组可供选择的数据存储在列表中，以下拉菜单或列表的形式供用户在其中选择，其中name是选项的提示文字，value才是选择的值。
它的HTML 代码如下：<select name=”career” size=”3” multiple=”multiple”><option value=”001” selected=”selected”>公司员工</option><option value=”002”>在校学生</option><option value=”003”>公务员</option></select><select></select>表示此处为列表表单元素，name为表单元素的名字。
Size属性表示一次显示n个值，如果n=1则用下拉列表形式，n>1表示带滚动条的列表。
multiple=”multiple”属性表示此列表允许多选，没有此属性时表示单选。
<option></option>标记定义列表的一个列表项，标记体中的文字为提示汉字。
Selected属性表示此项是否已经被选定。
选定一个”name=value”可选项，提交表单后，只有value被提交，提示文字name不被提交。
(7)文件域表单元素文件域表单由一个文本域和一个按钮组成，单击按钮后会激活一个文件选择对话框，从本地磁盘中选择一个文件，被选中文件的路径极文件名自动填写在文本域中。
上传文件时，需要用到文件域。
文件域的HTML代码如下：<input name=”doc” type=”file” id=”doc” value=”c:\my1.txt”/>文件域用<input>标记实现，type=”file”表示这是一个文件域表单元素。
id和name属性均为文件域的名字，value属性为被选中文件的路径及文件名。
6．超链接<a>标记的href属性可以定义超链接，它的一般用法是：<a href=”next.htm”>下一页</a>href属性值为目标资源的URL，如果是空链接，则URL写为“#”。