「HTML」(Hyper Text Markup Language): 超文本标记语言
它可以加入图片、声音、动画、多媒体等内容（超越文本限制 ）
它还可以从一个文件跳转到另一个文件，与世界各地主机的文件连接（超级链接文本）。
「HTML骨架格式」
<html>
<!-- 页面中最大的标签 根标签 -->
<head>
<!-- 头部标签 -->
<title></title>
<!-- 标题标签 -->
</head>
<body>
...
</body>
<!-- 文档的主体 -->
</html>
HTML标签名、类名、标签属性和大部分属性值统一用小写
文档类型< !DOCTYPE >
**「文档类型」**用来说明你用的XHTML或者HTML是什么版本。< !DOCTYPE html>告诉浏览器按照HTML5标准解析页面。
页面语言 lang
lang指定该html标签内容所用的语言
<html lang="en">
en 定义语言为英语 zh-CN定义语言为中文
「字符集」
UTF-8是目前最常用的字符集编码方式
<meta charset="UTF-8" />
标题标签h(h1~h6)
段落标签<p> </p>,可以把 HTML 文档分割为若干段落
换行标签<br />
「 排版标签」
b和strong 文字以粗体显示
i和em 文字以斜体显示
s和del 文字以加删除线显示
u和ins 文字以加下划线显示
图像标签
<img src = "图像URL" />
image的缩写
src是<img>标签的必须属性，他用于指定图像文件的路径和文件名
属性：简单理解是属于这个图像标签的特性
属性 属性值 描述
src URL 图像的路径
alt 文本 图像不能显示时的替换文本
title 文本 鼠标悬停时显示的内容
width 像素 设置图像的宽度
height 像素 设置图像的高度
border 数字 设置图像边框的宽度
路径
相对路径：图片相对于HTML页面的位置
相对路径分类 符号 说明
同一级路径 图像文件位于HTML文件同一级 如<img src="baidu.gif" />
下一级路径 / 图像文件位于HTML文件下一级 如<img src="images/img.jpg" />
上一级路径 ../ 图像文件位于HTML文件上一级 如<img src="../2.png" />
绝对路径：是指目录下的绝对位置，直接到达目标位置，通常是从盘符开始的路径。\
超链接标签
超链接语法格式
<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>
target="_self" 默认窗口弹出方式
target="_blank" 新窗口弹出
anchor 锚
属性 作用
href 用于指定链接目标的url地址，（必须属性）当为标签应用href属性时，它就具有了超链接的功能
target 用于指定链接页面的打开方式，其取值有_ self和 _ blan两种，其中_ self为默认值，_blank为在新窗口中打开方式。
链接分类
外部链接
例如<a href="http://www.qq.com" target="_blank">腾讯</a>
内部链接
网站内部之间的相互链接，直接链接内部页面名称即可。
例如<a href="index.html">首页</a>
<h4>内部链接：网站内部页面之间的相互链接</h4>
<a href="inner.html" target="_blank">内部链接</a>
空链接
如果当时没有确定链接目标时， <a herf="#">首页</a>
下载链接
如果href里面地址是一个文件或者压缩包，会下载这个文件。
网页元素链接
在网页中的各种网页元素，如文本、图像、表格、音频、视频等都可以添加超链接
例如：给图片添加超链接
<h4>网页元素链接</h4><a href="http://www.baidu.com"><img src="img.jpg" /></a>
注释标签
<!-- 内容 -->
快捷键：Ctrl+/
特殊字符
表格基本语法
<table> <tr> <td>单元格内的文字</td> ... </tr> ...</table>
table、tr、td，他们是创建表格的基本标签，缺一不可
table用于定义一个表格标签。
tr标签 用于定义表格中的行，必须嵌套在 table标签中。
td 用于定义表格中的单元格，必须嵌套在< tr>< /tr>标签中。
字母 td 指表格数据（table data），即数据单元格的内容，现在我们明白，表格最合适的地方就是用来存储数据的。td像一个容器，可以容纳所有的元素。
表格属性
这些属性要写到标签table里面去
三参为0，平时开发的我们这三个参数 border cellpadding cellspacing 为 0
属性名 属性值 描述
align left、center、right 规定表格相对周围元素的对齐方式
border “1"或”" 规定表格单元是否拥有边框，默认为""，表示没有边框
cellpadding 像素值 规定单元边沿与其内容之间的空白，默认1像素
cellspacing 像素值 规定单元格之间的空白，默认2像素
width 像素值或百分比 规定表格的宽度
height 像素值或百分比 规定表格的高度
表格结构标签
<thead>标签：表格的头部区域。<thead>内部必须拥有<tr>标签，一般是位于第一行。
<tbody>标签：表格的主体区域，主要用于放数据本体。
对于比较复杂的表格，表格的结构也就相对的复杂了，所以又将表格分割成三个部分：题头、正文和脚注。而这三部分分别用:thead,tbody,tfoot来标注， 这样更好的分清表格结构。
注意：
1、< thead>< /thead>：用于定义表格的头部。用来放标题之类的东西。< thead> 内部必须拥有< tr> 标签！
2、< tbody>< /tbody>：用于定义表格的主体。放数据本体 。
3、< tfoot>< /tfoot>放表格的脚注之类。
4、 以上标签都是放到table标签中。
合并单元格
合并的顺序我们按照 先上 后下 先左 后右 的顺序 ,合并完之后需要删除多余的单元格。
跨行合并：rowspan="合并单元格的个数"
跨列合并：colspan="合并单元格的个数"
目标单元格：(写合并代码)
跨行：最上侧单元格为目标单元格，写合并代码
跨列：最左侧单元格为目标单元格，写合并代码
合并单元格三部曲：
先确定跨行还是跨列合并
找到目标单元格，写上合并方式=合并的单元格数量。比如：<td colspan="2"></td>
删除多余的单元格
表格总结
标签名 定义 说明
< table>< /table> 表格标签 就是一个四方的盒子
< tr>< /tr> 表格行标签 行标签要再table标签内部才有意义
< td>< /td> 单元格标签 单元格标签是个容器级元素，可以放任何东西
< th>< /th> 表头单元格标签 它还是一个单元格，但是里面的文字会居中且加粗
< caption>< /caption> 表格标题标签 表格的标题，跟着表格一起走，和表格居中对齐
clospan 和 rowspan 合并属性 用来合并单元格的
列表
布局。
**「列表ul」**容器里面装载着结构，样式一致的文字或图表的一种形式，叫列表。
列表最大的特点就是整齐 、整洁、 有序，跟表格类似，但是它可组合自由度会更高。
无序列表ul (重点)
< ul>< /ul>中只能嵌套< li>< /li>，直接在< ul>< /ul>标签中输入其他标签或者文字的做法是不被允许的。
< li>与< /li>之间相当于一个容器，可以容纳所有元素。
有序列表ol
< ol>标签中的type属性值为排序的序列号，不添加type属性时，有序列表默认从数字1开始排序。
常用的type属性值分别为是1，a，A，i，I
< ol reversed=“reversed”>中的reversed属性能够让有序列表中的序列倒序排列。
< ol start=“3”>中的start属性值为3，有序列表中的第一个序列号将从3开始排列。
自定义列表dl
定义列表常用于对术语或名词进行解释和描述，定义列表的列表项前没有任何项目符号。
表单控件：
包含了具体的表单功能项，如单行文本输入框、密码输入框、复选框、提交按钮、重置按钮等。
提示信息：
一个表单中通常还需要包含一些说明性的文字，提示用户进行填写和操作。
表单域：
它相当于一个容器，用来容纳所有的表单控件和提示信息，可以通过他定义处理表单数据所用程序的url地址，以及数据提交到服务器的方法。如果不定义表单域，表单中的数据就无法传送到后台服务器。
表单域
收集的用户信息怎么传递给服务器？
通过form表单域
目的：
在HTML中，form标签被用于定义表单域，以实现用户信息的收集和传递，form中的所有内容都会被提交给服务器。
常用属性：
每个表单都应该有自己表单域。后面学 ajax 后台交互的时候，必须需要form表单域。
属性 属性值 作用
action url地址 用于指定接收并处理表单数据的服务器程序的url地址。
method get/post 用于设置表单数据的提交方式，其取值为get或post。
name 名称 用于指定表单的名称，以区分同一个页面中的多个表单。
表单控件（表单元素）
input 控件
input 输入的意思
< input />标签为单标签
type属性设置不同的属性值用来指定不同的控件类型
除了type属性还有别的属性
扫一扫
4028
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
