这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天
什么是前端?
-
解决GUI人机交互问题
-
跨终端 (PC/移动浏览器 客户端/小程序 VR/AR 等)
-
Web 技术栈
前端技术栈
前端基础技术栈是（HTML（内容）、CSS（样式）、JavaScript（行为））以及服务端构成，并且通过http等网络协议实现交互，构成了前端基础技术栈。
前端关注方面
功能 美观 无障碍（所有人是否可用） 安全 性能 兼容性（各种设备可以使用） 用户体验
前端发展技术更新换代快 上手快
HTML
html简称为
hypertext markup language
超文本 开始结束标签来表示一个内容
图片文本链接表格 <></>
head渲染页面 框架，要包括全部 表示不需要直接呈现在页面，如页面编码，页面标题
body 直接呈现
html文件会经过解析成一个DOM树 将html代码转化为树结构，每个节点为dom节点
html语法
- 标签和属性不区分大小写，推荐小写
- 空标签可以不闭合
- input ，meta 属性组推荐使用双引号包裹
常用标签
- 标题标签字号从大到小为h（固定）+（1~7）
- 列表标签分为
-
有序列表---展示默认有数字排序
-
无序列表 ul li
-
dl dt dd 为多对多
3. 链接 a
- 属性值 href= 超链接引用地址 target=blank 设置新窗口打开
- 图片链接 img alt
- 视频链接audio controls 默认播放控件 video
4.选择
- 单选 type=checkbox
- 多选 radio name=要相同
- 下拉 select option 提供提示
文本类 引用
- 长引用 blockquote
- 短引用 cite
- q 引用名字
- code 代码引用
- 强调 strong 突出重要
- em 语气强调
页面划分
语义化
- HTNL中的元素、属性及属性值都拥有某些含义
- 开发者应该遵循
语义来编写HTML- 有序列表用ol；无序列表用ul
- lang属性表示内容所使用的语言
使用HTML
- 开发者 - 修改、维护页面
- 浏览器 - 展示页面
- 搜索引擎 - 提取关键字、排序
- 屏幕阅读器 - 给盲人读页面内容
