这是我参与「第四届青训营」笔记创作活动的的第1天
一、前端概述
1、什么是前端?
- 解决图形界面下的人机交互问题
- 跨终端（PC/移动浏览器、客户端/小程序、VR/AR等）
- Web技术栈
2、前端技术栈
- HTML（负责页面内容、结构）
- css（设置页面样式，如位置、大小、颜色）
- JavaScript（页面行为）
3、前端应关注哪些方面？
- 功能（核心）
- 性能
- 美观
- 兼容性
- 安全
- 无障碍
二、HTML是什么？
1、概念
HTML (HyperText Markup Language) 超文本标记语言，不是一门编程语言，而是一种用来告知浏览器如何组织页面的标记语言。
2、HTML语法
- 标签和属性不区分大小写，推荐小写
- 空标签可以不闭合，比如input,meta
- 属性值推荐用双引号包裹
- 某些属性值可以省略，比如required,readonly
3、语义化是什么？
- HTML中的元素、属性及属性值都拥有某些含义
- 开发者应该遵循语义来编写HTML
- 有序列表用ol;无序列表用ul
- lang属性表示内容所使用的语言
4、谁在使用我们写的HTML？
- 开发者-修改、维护页面
- 浏览器-展示页面
- 搜索引擎-提取关键词、排序
- 屏幕阅读器-给盲人读页面内容
5、语义化的好处
- 代码可读性
- 可维护性
- 搜索引擎优化
- 提升无障碍性
三、常用标签
- 标题：h1-h6
- 有序列表：ol li
- 无序列表：ul li
- 定义列表：dl dt dd
- 连接：a href
- 图片：img
- 音频：audio
- 视频：video
- 输入：input
- 多选：checkbox
- 单选：radio（name相同）
- 下拉选项：select option
- 块级引用：blockquote
- 短引用：cite
- 引用之前内容：q
- 引用代码：code
- 强调：strong em
- 原样输出：pre
- 头标签：head
- 主体：main
- 侧边栏：aside
- 底部：footer
