前端与HTML ｜ 青训营笔记

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

记录课堂笔记如下：

• 什么是前端？

1. 解决GUI人机交互问题
2. 跨终端
3. WEB技术栈

• 前端技术栈

HTML(内容）CSS(样式),JavaScript(行为)运行在浏览器里,浏览器通过HTTP协议与服务器进行通信。

• 前端应该关注哪些方面？

1. 功能
2. 美观
3. 无障碍
4. 安全
5. 性能
6. 兼容
7. 体验

• 前端开发环境

1.浏览器

IE，Chrome，Firefox，Safari

2.编辑器

VSCode,Vim,WebStorm

• HTML

HyperText MarkUp Language——超文本标记语言，是用来描述网页的一种语言

1. 语法

• 标签和属性不区分大小写
• 空标签可以不闭合
• 属性值用双引号包裹
• 某些属性值可以省略

2. 标题标签

<h1>~<h6>

3. 普通标签

<img src="" ></img>

4.多选框标签

<input type="checkbox">

5. 单选框标签

<input type="radio">

6. 创建下拉列表

<select>

7. 定义列表中的可用选项

<option>

8.标签来定义作品的标题

<cite>

• 语义化是什么？

1. HTML中的元素、属性及属性值都拥有某些含义

2. 开发者应该遵循语义来编写HTML

   例如：有序列表用ol;无序列表用ul lang属性表示内容所使用的语言等

3. 好处

   代码可读性、可维护性、搜索引擎优化、提升无障碍性

• 如何做到语义化：

1. 了解每个标签和属性的含义
2. 思考什么标签最适合描述这个内容
3. 不使用可视化工具生成代码

• 第一节课结束

第一节课程了解前端是什么的，以及一些基础知识，对于零基础还是比较友好？第一节课半小时虽然短还是期待一下后面的课程有更多知识吧，希望能学到东西有收获，小组虽然还没有组队，还是会认识志同道合的朋友吧，一起进步！