前端与HTML | 青训营笔记

381 阅读2分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天。

一、本堂课重点内容:

本堂课的知识要点有:

  1. 前端工作的定义
  2. 前端技术栈拆解与分析
  3. HTML 作用解析
  4. HTML 语义化

二、详细知识点介绍:

本堂课介绍的知识点如下:

1. 前端工作的定义

什么是前端?

  • 解决GUI人机交互问题
  • 跨终端
    • PC/移动浏览器
    • 客户端/小程序
    • VR/AR等
  • Web技术栈

前端应该关注哪些方面? 前端应该关注:功能、体验、无障碍、性能、兼容、美观、安全...

2. 前端技术栈拆解与分析

什么是前端技术栈? 前端技术栈分为三层:HTML、CSS、Javascript

image.png

3. HTML 作用解析

什么是HTML?

HTML的全称为超文本标记语言,是一种标记语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。

HTML是三个英文单词的缩写:HyperText Markup Language

  • HyperText包含图片、标题、链接、表格
  • Markup Language表示各类标签

HTML标签:

  1. 标题标签:h1-h6
  2. 字体标签:font
  3. 段落标签:p
  4. 换行标签:br
  5. 水平线标签:hr
  6. 图片标签:img
  7. 背景音乐:audio
  8. 视频标签:video
  9. 超链接标签:a
  10. 列表标签:ol(有序列表),ul(无序列表)
  11. marquee标签
  12. 文本设置标签

image.png

4. HTML 语义化

语义化是什么?

语义化是指用合理HTML标记以及其特有的属性去格式化文档内容。

  • HTML中的元素、属性及属性值都拥有某些含义
  • 开发者应该遵循语义来编写HTML
    • 有序列表用ol;无序列表用ul
    • lang属性表示内容所使用的语言

三、实践练习例子:

  • 有什么实践举例帮助理解知识点?

四、课后个人总结:

本章中知识点都较为基础,很好理解,重点需要知道HTML各类标签的使用和语义化的理解。