前端

• 概述
  • 解决问题：图形界面的人机交互。GUI
  • • HTML 指的是超文本标记语言: HyperText Markup Language，不是一种编程语言，而是一种标记语言
  • 构成
    • 网络协议
    • HTML
    • CSS
    • JavaScript
  • 关注点：功能（核心）/体验、美观、性能（响应）、兼容（多设备）、无障碍（不仅仅针对残疾人群，更要关注各种环境下的无障碍体验：eg公交车场景，不稳，按键不容易点到）
  • 拓展：nodejs等
  • 开发环境：
    • 浏览器：谷歌等
    • 编辑器：vim、vscode、webstorm

网络协议

• HTTP

HTML

• 含义

• DOM树。层级展开，每个部分都是一个dom节点

• 语法

  • 语义化。遵守语法规范，合适的语法
  • 内容而非样式
  • 小写方便和react，vue等大写区分
  • 空标签，比如img，里面无其他内容，结尾不写结束标签或者只用/结束即可
  • 某些属性值是必填字段，相当于true，可以省略

• 标签（举一些例子）

  • 文字
    • 标题：h1~h2
    • 列表
      • 1.有序列表
      • 2.无序列表
      • 3.定义列表（key value形式）：属性名+属性值<dl。<dt标题。<dd具体。
    • 链接
      • 1.href=”链接地址”
      • 2.其他语法，如插入图片音频视频等 img。audio。video。
    • 输入<input。比如表单类
    • 选择<p 多选、单选（互斥）、下拉选项、自由输入，提供提示词
    • 文本 引用、短引用、引用代码（单行、多行）、强调（重点、语气）
    • 页面划分（盒模型）

刚学习HTML的时候，我的第一感觉是有些复杂，因为我以前从来没有接触过这方面的知识。上过这次课程之后我逐渐明白了HTML的基本概念和语法规则。在实践过程中，我深刻体会到HTML的重要性，为什么HTML是前端的基础，是网页制作不可或缺的一部分。 虽然只是跟着老师把代码重现，但是已经能够感受到这种淡淡的兴奋和满足。虽然只是一些简单的标签和样式，但是它真正让我感到亲身参与到了网页制作中。对CSS和JavaScript的学习有了更大的兴趣，来实现更加复杂的效果。