| Web | |||
|---|---|---|---|
| UI | 前端 | 后端 | 运维 |
| 前端 | ||
|---|---|---|
| HTML(5) | CSS(3) | JavaScript(6) |
2024.11.21
| HTML | |
|---|---|
| 元素 | 备注 |
| div | 容器 |
| span | 容器 |
| a | 超链接 |
| img | 图片 |
| h1-h6 | 一级标题-六级标题 |
| ul/li | 无序列表 |
| ol/li | 有序列表 |
| CSS | |
|---|---|
| 属性 | 备注 |
| width/height | 设置宽高 |
| background-color | 设置背景色 |
| color | 设置文本颜色 |
| :hover | 鼠标悬浮效果 |
2024.11.22
| HTML | |
|---|---|
| 元素 | 备注 |
| hr | 分割线 |
| br | 换行符 |
| input(text、password) | 输入框(文本、密码) |
| textarea | 文本域 |
| label | 标签 |
| button | 按钮 |
2024.11.24
| HTML | |
|---|---|
| 元素 | 备注 |
| video(control) | 视频播放器 |
| p | 容器 |
| iframe | 框架 |
| CSS | |
|---|---|
| 属性 | 备注 |
| display(inline-block、block、inline、none) | 展示效果 |
| text-indent | 缩进 |
| border(width、style、color) | 设置边框 |
| border-radius | 设置圆角 |
| margin | 外边距 |
| padding | 内边距 |
2024.12.02
| CSS | |
|---|---|
| 属性 | 备注 |
| text-align（left、center、right） | 文本对齐方式 |
| font-family | 字体 |
| font-weight | 字体加粗，对应html<b></b> |
| font-style | 字体倾斜，对应html<i></i> |
2024.12.04
| HTML | |
|---|---|
| 元素 | 备注 |
| table/thead/tbody/tr/th/td | 表格 |
| CSS | |
|---|---|
| 属性 | 备注 |
| line-height（left、center、right） | 行高 |
| * | 通配符 |
| box-sizing | 盒模型 |
2024.12.05
- css选择器（直接子、后代、并集）
- css加载方式（连接引入、内嵌样式、内联样式）
| CSS | |
|---|---|
| 属性 | 备注 |
| flex/items-center/justify-content | 弹性盒子 |
| position(relative、absolute、fixed、sticky) | 定位 |
暂未整理...
| HTML5 | ||
|---|---|---|
| 标签 | 是否学习 | 备注 |
| canvas | ||
| form/input:submit | ||
| audio | ||
| CSS3 | ||
|---|---|---|
| 属性 | 是否学习 | 备注 |
| text-indent | 缩进 | |
| overflow | 溢出 | |
| background-image | 背景图/渐变 | |
| box-shadow | 盒阴影 | |
| text-shadow | 文字阴影 | |
| transition | 过渡效果 | |
| transform(translate、scale、skew) | 偏移、缩放、倾斜 | |
| opacity | 透明度 | |
| @keyframes | 关键帧 | |
| @media | 适配不同屏幕 | |