HTML概念
- HTML(Hypertext Markup Language)即超文本标记语言
HTML发展史
- 1993年(IETE)HTML1.0
- 1995年(W3C)HTML2.0
- 1996年(W3C)HTML3.2
- 1997年(W3C)HTML4.0(SGML)
- 1999年(W3C)HTML4.01——分化点——2004年(WHWHATWG)HTML5草案
- 2000年(W3C)XHTML1.0
- 2001年(W3C)XHTML1.1——分歧——XHTML2.0?
- 2008年(合并)HTML5正式版
- 2014年HTML5定稿
HTML特点
- HTML不需要编译,直接有浏览器执行
- HTML史一个文本文件
- HTMl文件必须使用html或xml为文件名后缀
- HTML大小写不敏感,HTML和html一样
HTML基本机构
HTML标签
- 语法:<标签名></标签名>
- 例子:<html></html>
- 规范 : 1、一般成对出现,结束标签比开始标签多了一个/
2、单标签:没有结束标签,如<img /> 、<hr />
HTML标签属性
- 语法:< 标签名 属性名1=‘值’ 属性名2=‘值’>......</标签名>
HTML注释
- 注释在网页中不显示
Documnet文档类型声明
- <!document>声明必须放在HTML文档第一行
- <!document>声明不是HTML标签
网页编码设置
-
当网页显示出现乱码时,在<head></head>标签之间添加:
<meta http-equiv='Content' content='text/html;charset=uth-8'></meta>
文字和段落标签
- 标题标签<h1~ h6></h1~ h6>
- 段落标签 <p></p>
- 换行标签<br />
- 水平线<hr />
- 文字斜体: <i></i>、<em></em>
- 加粗:<b></b>、<strong></strong>
- 下标:
- 上标:
- 插入内容:<ins>
- 删除内容:<del>
特殊符号
属性 | 显示结果 | 描述 |
---|---|---|
<; | < | 小于号或显示标记 |
>; | > | 大于号或显示标记 |
®; | ® | 已注册 |
©; | © | 版权 |
&trade; | ® | 商标 |
 ; | space | 不断行的空白 |
列表标签
- 无序列表
<ul>
<li></li>
<ul/>
- 有序列表
<ol>
<li></li>
<ol/>
- 定义列表
<dl>
<dt>定义列表项</dt>
<dd>列表项描述</dd>
<dd>列表项描述</dd>
</dl>
图像标签
- <img src='图片路径' alt='图片无法正常加载的显示的文本' heght='图片高' width='图片宽'>
超链接标签
- <a href='链接' name='链接命名' target='打开窗口方式' title='鼠标划过显示的文字'></a>
- <a href='mailto:邮件地址'></a>
HTML表格
-
语法与结构
-
表格属性
-
<td>和<th>标签属性
跨列属性colspan
<table>
<tr>
<td colspan='2'>..</td>
<td>..</td>
</tr>
<tr>
<td>..</td>
<td>..</td>
<td>..</td>
</tr>
</table>
- 跨行属性rowspan
<table>
<tr>
<td>..</td>
<td rowspan='2'>..</td>
<td>..</td>
</tr>
<tr>
<td>..</td>
<td>..</td>
</tr>
</table>
HTML表单
-
表单的工作原理
-
form标签
- input标签:<input type='类型属性' name='名称' placeholder='用户填入字段提示' value='文本框默认值' >
type属性 | 描述 |
---|---|
text | 文字域 |
password | 密码域 |
file | 文件域 |
checkbox | 复选框 |
radio | 单选框 |
button | 按钮 |
submit | 提交按钮 |
reset | 重置按钮 |
hidden | 隐藏域 |
image | 图像域 |
- 下拉菜单
<select>
<option value="定义送往服务器的选项值" selected="设置初始选中状态">...</option>
</select>
属性 | 描述 |
---|---|
name | 设置下拉菜单和列表名称 |
multiple | 设置可选择多个选项 |
size | 设置列表中可见选项的数目 |
- 分组下拉菜单
<select>
<optgroup label='组1'>
<option value="定义送往服务器的选项值" selected="设置初始选中状态">...</option>
</optgroup>
<optgroup label='组2'>
<option value="定义送往服务器的选项值" selected="设置初始选中状态">...</option>
</optgroup>
</select>
-
多行文本域 <textarea>
-
HTML重要标签
- button里的按钮在表单里才会有意义
- label和input的属性进行关联
注:文章内容借鉴慕课网