一. 前端应该关注哪些方面
美观 功能 安全 无障碍 性能 兼容
二. 前端开发环境
1.浏览器:
IE/Edge Chrome Firefox Safari
2.编辑器
VSCode Vim WebStorm
三. HTML是什么？
- HyperText: 图片 标题 链接 表格
- Markup Language:
eg：<h1>文章标题</h1> <img src="" alt="">
四. HTML语法
1.标签和属性不区分大小写，推荐小写
2.空标签可以不闭合，比如 input、meta
3.属性值推荐使用双引号包裹
4.某些属性值可以省略，比如 required、readonly
五. 标签
1.标题
<h1>~<h6>
2.列表
- 有序列表
<ol> - 无序列表
<ul> - 自定义列表
<dl> <dt> <dd>
3.输入
<input placeholder="请输入用户名"/><input type="range"/><input type="number" min="1" max="10"/>可通过min、max指定最大最小值<input type="date" min="2010-10-3"/><textarea>Hey</textarea>
4.选择
<label><input type="radio" name="one" />男</label>
<label><input type="radio" name="one" />女</label>
通过相同的name值互斥
<select><option></option></select>
下拉选择
5.文本
引用：<blockquote> <cite> <q>
代码：<code> <pre>
强调：<strong> <em>
strong重要性，em语气
六. 语义化是什么
- HTML中的元素、属性及属性值都拥有某些含义
- 开发者应该遵循语义来编写HTML
- 有序列表使用ol，无序列表使用ul
- lang属性表示内容所使用的语言
七. 语义化的好处
- 代码可读性
- 可维护性
- 搜索引擎优化
- 提升无障碍性
