开启掘金成长之旅！这是我参与「掘金日新计划 · 2 月更文挑战」的第 7 天，[点击查看活动详情]
前端技术栈
美观，功能，无障碍，性能，安全，兼容。
html (内容)
HyperText Markup Language 超文本标记语言。\
:标记了当前使用的html版本，决定使用哪种渲染模式。\< html>< /html>:根标签.
< head>< /head>:放页面元数据。
语法
- 标签和属性不区分大小写，推荐小写
- 空标签可以不闭合，例如 input,meta
- 属性值推荐用双引号包裹
- 某些属性值可以省略，required,readonly
- 标题：h1~h6
语义化
元素，属性，属性值拥有某些含义。
有序列表：ol,无序列表：ul
lang属性表示内容所使用的语言
CSS (样式)
Cascading Style Sheets
属性+属性值+；=声明。
一条条样式规则组成的。
link:默认。visited:访问过。hover:鼠标移上去。active:鼠标按下去。focus:聚焦
保留空格的方式：white-space= normal,nowrap,pre,pre-wrap,pre-line
作用
- 设置字体和颜色
- 设置位置和大小
- 添加动画效果
使用
- 外链：< link rel="stylesheet" href="/assets/style.css">
- 嵌入：< style>< /style>
- 内联：< p style="">< /p>
组合
直接组合：AB ，满足A同时满足B
后代组合：A B ,选中B，如果他是A的子孙。
亲子组合：A>B ,选中B，如果他是A的子元素。
兄弟选择器：A~B ,选中B，如果它在A后且和A同级。
相邻选择器：A+B ,选中B，如果它紧跟在A后面。
选择器组：body,p,h1,h2
调试CSS
1,右键点击页面，选择检查
2,使用快捷键：Ctrl+Shift+I 或者Cmd+Opt+I
JavaScript(行为)
推荐书：犀牛书，红宝书。\
- HTML、CSS、JS各司其职
- 应当避免不必要的由JS直接操作的样式
- 可以用class来表示状态
- 纯展示类交互寻求零JS方案
组件：指WEB页面上抽出来一个一个包含模板（html）,功能（js），样式（css）的单元。
好的组件具备封装性，正确性，扩展性，复用性。
