HTML超文本标记语言
W3C万维网联盟
W3C标准包括：
- 结构化标准语言（HTML,XML）
- 表现标准语言（CSS）
- 行为标准（DOM,ECMAScropt）
网页基本信息
使用 进行注释
!DOCTYPE告诉浏览器我们要使用什么规范
< head> 标签代表网页头部
- < title>网站标题
- < meta>用来描述我们网站的一些信息
< body>标签代表网页主体
最后都要用< /xxxx>闭合
网页基本标签
-
标题标签
- h1一级标签，以此类推
-
段落标签
- < p>分段
-
换行标签
- < br/>（写在后面）不用开头写东西，自闭和标签
- 换行其实还是一段，比段落的间距要小
-
水平线标签
- < hr/>自闭和标签
-
字体样式标签
- 粗体< strong>
- 斜体< em>
-
特殊符号
- 空格：& nbsp; 在代码中用正常空格无论用多少个都在网页上只显示一个
- 大于& gt;
- 小于& lt;
- 书名号& copy;
-
图像标签
-
相对路径：通过 .. 代表当前文件位置上一级目录
-
绝对路径：从盘开始
-
< img src="图片路径" alt="图片加载失败的代替文字" title="悬停文字（鼠标放在图片上显示的文字）" width=“宽度” height="高度">
-
-
连接标签
- < a href="路径" target="目标窗口位置">该链接的内容，可以是文字也可以是图片< /a>
- 目标窗口位置常用_blank在新标签打开 _self该页面打开
- 锚标签
- 需要一个锚标记< a name="top">顶部< /a> (使用name作为标记)
- href内容改为#标记
-
列表标签,内部用< li>
- 有序列表：< ol>
- 无序列表：< ul>
- 自定义列表:< dl>
- < dt>标题
- < dd>内容
-
表格标签< table>
- 行< tr> 列< td>
- 跨列 在td后面加上colspan="跨的列数"
- 跨行 在tr后面加上rowspan="跨的行数"
-
视频< video>后面加上controls有控制页面 autoplay自动播放
-
音频< audio>
页面结构分析
- header标题头部区域的内容
- footer标记脚步区域的内容
- section：Web页面中的一块独立区域
- article独立的文章内容
- aside相关内容或应用（常用于侧边栏）
- nav导航类辅助内容
iframe内联框架
使用这个标签可以嵌套页面
表单< form>
< form action="表单提交的位置，可以是网站也可以是请求" method="post/get两种方法">
get/post：
- get方式可以在url中看到提交的信息，不安全但是效率高
- post方式看不到
表单元素格式：
- type
- name指定表单元素的名称
- value元素的初始值，type为radio时必须指定一个值
- size表单初始宽度
- maxlength：类型为text或password时，输入的最大字符数
- checked：类型为radio或checkbox时，指定按钮是否被选中
- readonly只读
- disabled禁用
内容用< p >
input type = "text" name="username"会生成一个text框（还有password框），输入的内容命名为username
input type：(默认text)
- text
- password
- submit提交
- reset重置
- checkbox单选
- radio多选
- file
- hidden
- image
- button
- email邮箱验证
- url验证
- number 数字，可以加数减数还可以设置上限
- range滑块
- search搜索
下面不用input：
< p>中用< select>生成下拉框，用< option>设置内容，selected可以将该内容设置为默认
< p>中用textarea生成文本域 cols设置列，rows设置行
label可以打开某个框，增强鼠标可用性
表单初级验证
常用方法:
- placeholder 告诉用户要输入什么
- required非空判断
- pattern正则表达式判断