html5 基础
1.html 作用
| 序号 |
名称 |
描述 |
用途 |
| 1 |
HTML |
超文本标记语言 |
页面结构 |
| 2 |
CSS |
层叠样式表 |
元素样式与排列 |
| 3 |
JavaScript |
前端通用脚本语言 |
元素行为与交互 |
2.超文本标记语言
| 序号 |
名称 |
描述 |
| 1 |
超文本 |
普通文本上添加 属性 定义特殊行为 |
| 2 |
标记 |
使用标签作为页面元素的标识符 |
| 3 |
语言 |
没有流程控制算不上真正的语言 |
3.元素
- 网页是 html 元素的集合：由功能各异的 html 元素按照一定的规则排列而成。
网页是二维平面：任何元素只存在垂直或水平两种排列方式
根据元素的功能与排列方式 html 元素分为三类：
| 序号 | 名称 | 描述 | 举例 |
| —— | ————— | ———————————————————— | ———————— |
| 1 | 块级元素 | 垂直排列，宽高可定义，与内容无关 | <div>,<p> |
| 2 | 行内元素 | 水平排列，宽高由内容决定，无法自定义 | <span> ,<a> |
| 3 | 行内块元素 | 水平排列，但宽高可定义，常用用于外部资源 | <img> ,<video> |
4.标签和属性
| 序号 |
名称 |
描述 |
举例 |
| 1 |
标签 |
元素的基本用途 |
<h3>Hello</h3> |
| 2 |
属性 |
元素的基本特征 |
<h3 class="title" >Hello</h3> |
5.标签分类
| 序号 |
名称 |
语法 |
描述对象 |
| 1 |
双标签 |
<h3 class="title" >Hello</h3> |
自定义内容 |
| 2 |
单标签 |
<img src="1.jpg" alt="logo" > |
外部资源 |
- 双标签：由
起始标签和结束标签组成，属性写在起始标签中 - 单标签：也叫
空标签，由属性制定描述对象，如src
6.属性分类
| 序号 |
名称 |
举例 |
描述 |
| 1 |
预置属性 |
<ul class="nav" >...</ul> |
标签不同差异较大 |
| 2 |
自定义属性 |
<div data-index="5" >...</div> |
用户根据需求自定 |
7.通用属性
尽管不同标签预置的属性各不相同，但也有一些公共属性，绝大多数标签都具有
| 序号 |
属性名称 |
描述 |
举例 |
| 1 |
id |
元素唯一标识 |
<div idx="warp" >...</div> |
| 2 |
class |
给元素添加样式 |
<div class="box" >...</div> |
| 3 |
style |
设置当前元素样式 |
<div style="..." >...</div> |
8.属性和值
| 序号 |
值类型 |
备注 |
描述 |
| 1 |
字符串 |
小写，值加双引号 |
<p class="active" >...</p> |
| 2 |
预定义值 |
仅限预置 |
<input type="text" > |
| 3 |
指定格式 |
url/email/… |
<a href="https://baiduc.om" >...</a> |
| 4 |
数值 px |
默认像素 px |
<table width="200" >...</table> |
| 5 |
布尔值 |
存在即为 true |
<input type="email" required > |
9.元素的种类
- 标签的语化是元素的基本要求
- html5 提供了大量语义化的元素
- html 元素众多，但常用的并不多，我们重要放在以下几类元素上
| 序号 |
元素类型 |
描述 |
举例 |
| 1 |
结构元素 |
布局 |
<header> </header>, <main> ,<nav> |
| 2 |
文本元素 |
内容 |
<p> ,<addr>,<strong> |
| 3 |
链接元素 |
页面跳转 |
<a herf="..." >...</a> |
| 4 |
列表元素 |
关联数据 |
<ul>+<li> <ol>+<li> |
| 5 |
表格元素 |
数据格式化 |
<table><tbody> <tr><td></table> |
| 6 |
表单元素 |
前后端交互 |
<form>+<label>+<input> |
| 7 |
其他元素 |
不常用 |
<iframe>+</iframe> <video></video> |
表单是前后端数据交互的重要通道，除了 url 之后，表单是非常重要的。
需要花费大量的时间研究学习和实践
