HTML
| 标签名 | 定义 | 说明 |
|---|
| html | html标签 | html标签是页面最大的标签，我们称他为根标签 |
| head | 文档的头部 | 注意在head标签中我们必须设置title标签 |
|---|
| title | 文档的标题 | 让页面拥有一个属于自己的网页标题 |
| body | 文档的主体 | 元素包含文档的所有内容，页面内容基本都放在body里面 |
|---|
一个HTML的框架
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>
标题标签(h1--h6)
标题标签从h1到h6逐渐递减，标题独占一行
我是h1标签
我是h2标签
我是h3标签
我是h4标签
我是h5标签
我是h6标签
段落标签和换行标签
段落标签会使得段落与段落之间有较大的空隙，而换行标签只是换一行
<p>换行标签</p>
<br />换行标签
注释 快捷键 ctrl+/
文本格式化标签（粗体、倾斜、删除线、下划线）都是双标签
| 加粗 | strong或b |
|---|
| 倾斜 | em或i |
|---|
| 删除线 | del或s |
|---|
| 下划线 | ins或u |
|---|
图像标签和路径
图像标签是单标签
<img src="图片地址" />
| 属性 | 定义 | 说明 |
|---|
| src | 图片路径 | 必须属性 |
| alt | 文本 | 替换文本，图像不能显示的文字 |
| title | 文本 | 提示文本，鼠标放在图像上，显示文字 |
| width | 像素 | 设置图像的宽度 |
| height | 像素 | 设置图像的高度 |
| border | 像素 | 设置图片的边 |
- 图像标签可以拥有多个属性，必须写在标签名的后面
- 属性之间不分前后顺序，标签名与属性、属性与属性名之间均以空格分开
- 属性采取键值对的格式，即key=”value“的格式，属性=属性值
<img src="123.jpg"alt="图片不显示，就显示alt" title="大家好" width=200 height=200 border=1/>
| 相对路径 | 以引用文件所在位置为参考基础而建立出的目录路径，下一路径/ 上一路径../ |
|---|
| 绝对路径 | 完整的把图片路径写入 |
|---|
超链接
语法：
<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>
| href | 用于指定链接目标的url地址（必须属性）当标签应用href属性时，它就具有超链接的功能 |
|---|
| target | 用于指定链接页面打开方式，其中_self为默认值即在原窗口打开，_blank在新窗口打开 |
|---|
- 外部链接：http://..........
- 内部链接：直接写路径<、li>
- 空链接：如果暂时没有地址，可以让href="#"
- 下载链接：如果href里面地址是一个文件或压缩包，会下载这个文件下载压缩包
- 网页元素链接：在网页中的各种网页元素、如文本、图像、表格、音频、视频都可以添加超链接
锚点链接
点击锚点链接可以快速定位到页面中的某个位置
- 在链接文本的href属性中，设置属性值为#名字的形式如 href="#第二季"
- 找到目标位置标签，里面添加一个id属性=刚才的名称，即 id="第二季"
表格标签
表格的基本语法：
<table>
<thead>
<tr>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
- table是用于定义表格的标签
- tr标签是用于定义表格中的行，必须嵌套在table中
- td用于定义表格中的单元格，必须嵌套在tr标签中
- th标签一般位于表格的第一行或第一列，th单元格里面的内容加粗居中显示
表格标签的属性
这些属性必须写到表格标签table里面
| 表格属性 | 属性值 | 描述 |
|---|
| align | left center right | 规定表格相对周围元素的对齐方式 |
| border | 1或"" | 规定表格单元是否有边框，默认""没有边框 |
| cellpadding | 像素值 | 规定单元表格边沿与内容之间的空白，默认1像素 |
| cellpadding | 像素值 | 规定单元表格之间的空白，默认2像素 |
| width | 像素值或百分比 | 规定表格的宽度 |
| height | 像素值或百分比 | 规定表格的高度 |
合并单元格
- 跨行合并：rowspan="合并单元格的个数，跨行合并最上侧单元格为目标单元格，写合并代码
- 跨列合并：colspan="合并单元格的个数，跨列合并最左侧单元格为目标单元格，写合并代码“
列表标签
1、无序列表
ul标签表示HTML页面中项目的无序列表，一般会以项目符号呈现列表项，而列表项使用li标签定义 语法：
<ul>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
</ul>
注意：
无序列表的各个项之间没有顺序之分，是并列的
ul中只能套用li,直接在ul里面输入其他标签或者文字，这样的做法是错误的
li里面放什么都可以
2、有序列表
在HTML中ol标签用于定义有序列表，列表排序以数字来显示，并且使用li标签来定义列表项 语法：
- 列表项1
- 列表项2
- 列表项3
注意： ol里面只能套用li,直接在ul里面输入其他标签或者文字，这样的做法是错误的 li里面放什么都可以
3、自定义列表
在HTML中dl标签用于定义描述列表（或定义列表）该标签会与dt（定义项目）和dd(描述每一个项目）一起用 语法：
<dl>
<dt>名词</dt>
<dd>名词解释1</dd>
<dd>名词解释2</dd>
</dl>
注意：
dt和dd是兄弟关系
dl里面只能含有dt和dd
dt和dd没有个数限制，经常一个dt对应多个dd
表单元素
在input标签中，包含一个type属性，根据不同type属性值，输入字段拥有很多种形式（可以是文本字段、复选框、掩码后的文本控件、单按钮、按钮）
<input type="属性值"/>
- input标签为单标签
- type属性设置不同的属性值用来指定不同的控制类型
| type属性值 | 描述 |
|---|
| buttor | 定义一个可点击按钮 |
| checkbox | 定义复选框 |
| file | 定义输入字段和浏览按钮，供文件上传 |
| hidden | 定义隐藏的输入字段 |
| image | 定义图像形式的提交按钮 |
| password | 定义密码字段 |
| radio | 定义单选按钮 |
| submit | 定义提交按钮，提交按钮会把表单数据发送到服务器 |
| text | 定义单行的输入字段 |
| submit | 点击提交按钮可以把表单域内容传到后台 |
| reset | 点击重置按钮可以把表单还原到初始状态 |
除了type属性外，input标签还有其他很多属性，其常用的属性有 如下
| 属性 | 属性值 | 描述 |
|---|
| name | 由用户自定义 | 定义input元素的名称 |
| value | 由用户自定义 | 规定input元素的值（打开页面默认显示） |
| checked | checked | 规定此input元素首次加载时应当被选中 |
| maxlength | 正整数 | 规定输入字段中的字符的最大长度 |
- name和value是每一个表单元素都有的属性值主要给后台人员使用
- name表单元素的名字，要求单选按钮和复选框要有相同的name值
- checked属性主要针对于单选按钮和复选框，主要作用一打开页面，就可以默认选中某个表单元素
194
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
