前端与HTML|青训营笔记

67 阅读3分钟

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

前端与html

1.什么是前端工程师,前端工程师是干嘛的

前端工程师就是使用web技术栈解决多端图形界面交互问题的工程师
前端技术栈主要由三部分组成html css javasript

image.png 浏览器可以通过HTTP协议服务器进行通讯,他把前面前端的这些代码通过HTTP协议从服务器上去拿到,拿到之后把它渲染成我们看到的页面的浏览器呢,也可以把用户填写的内容,或者用户的一些行为,通过HTTP协议提交到服务器端

2.那么要想成为一名优秀的前端工程师,我们应该关注哪些方面?

image.png 就我个人而言,一开始学习前端的初衷便是能够以更加人性化的方式服务于使用者,优化用户体验,提升用户在产品使用过程中的体验感和认同感,让互联网变得有温度,有人性的温度。

随着科技的不断发展,前端的边界也在不断扩展、拓宽

image.png

当然,前端开发不需要什么门槛,只需要一个浏览器和一个代码编辑器就可以

image.png

3.html是什么

hypertext markup language

hypertext超文本 不是简单的纯文字的东西,可能有图片、列表、标签之类的

markup language表示使用标记语言表示这些超文本

4.语义化标签

语义是指对一个词或者句子含义的正确解释,那么语义化标签就是指元素本身传达了关于标签所包含内容类型的一些信息。例如,当浏览器解析到h1标签时,它将该标签解释为包含这一块内容的最重要的标题。h1标签的语义就是用它来标识特定网页或部分最重要的标题。

image.png

自定义列表列表

dl definitionlist

dt definitiontitle

dd definitiondiscription

5.html文件代码框架

image.png 第一行的这个!doctype html它标记了,我们当前在使用的这个HTML文件,它是什么样的一个HTML版本,最终,浏览器会根据这个去决定使用哪一种渲染模式,如果你不写,它就浏览器会以一种比较老旧的所谓的怪异模式去渲染这个页面,从而会造成你的页面展示效果和实际的可能不太符合。HTML这个标签是文档的根标签,所有的其他的标签都是写在HTML标签里边的。那我们可以看到HTML里边还有一个head标签,head标签里边会放一些页面的原数据,就是说页面上需要这个信息,但是又不需要直接呈现给用户的,比如说页面的标题是什么,然后页面用了什么样的编码。

在浏览器拿到html后,会将html解析成一个dom树,html中的所有元素都是dom树中的节点。