前端与HTML | 豆包MarsCode AI刷题

70 阅读2分钟

以下是我在2024青训营第二次课程学习的笔记,今天学习的课程为前端与HTML。主要为我们讲述了以下几个问题:

什么是前端工程师

前端工程师是使用Web技术栈解决多端图形交互问题的工程师。

前端技术栈

前端开发的三大核心语言分别是HTML、CSS、JavaScript:

  1. HTML(内容)
  2. CSS(样式)
  3. JavaScript(行为)

这些语言都是在浏览器上进行的,并通过网络协议与服务器端进行双向的通信。

03a9e6c1a19f0b8e9933dc2088cb36e3.jpg

前端应该关注那些方面

  • 功能
  • 美观
  • 无障碍
  • 安全
  • 性能
  • 兼容性
  • 用户体验

fee2a603a4f2091e162da4d6f3fe9c0.jpg

前端的边界

随着时代的发展,前端的边界也在不断扩展,更新换代非常之快,这需要我们不断地进行学习。

b7db8c798dd3018e409682ee5d016de7.jpg

开发环境

  • 浏览器
  • 编辑器

351cf4f8bf0628381afc05015f4036a.jpg

HTML基础介绍

HTML超文本标记语言——HyperText Markup Language)是构成 Web 世界的一砖一瓦。它定义了网页内容的含义和结构。除 HTML 以外的其他技术则通常用来描述一个网页的表现与展示效果(如 [CSS]),或功能与行为(如 [JavaScript])。

“超文本”(hypertext)是指连接单个网站内或多个网站间的网页的链接。链接是网络的一个基本方面。只要将内容上传到互联网,并将其与他人创建的页面相链接,你就成为了万维网的积极参与者。

HTML 使用“标记”(markup)来注明文本、图片和其他内容,以便于在 Web 浏览器中显示。HTML 标记包含一些特殊“元素”如 <head><title><body><header>等等。

HTML 元素通过“标签”(tag)将文本从文档中引出,标签由在“<”和“>”中包裹的元素名组成,HTML 标签里的元素名不区分大小写。也就是说,它们可以用大写,小写或混合形式书写。例如,<title> 标签可以写成 <Title><TITLE> 或以任何其他方式。然而,习惯上与实践上都推荐将标签名全部小写。

<img Scr = "photo.jpg"/> scr为属性名, photo.jpg为属性值

ed298ce3b37c8e97d3b423b722d53e6.jpg

基础应用

标题

8f71f965bbd266e915668c53f3acbef.jpg

列表

1e27ae348eb8aca7c72811c4ea8b2ee.jpg

链接

bc16db69aebee7118c0dfaa231b3007.jpg

多媒体

29552e9b51cd21b33a9991ab7389f7c.jpg

输入

aa725fc5874eb2c69f0c33192b0ec38.jpg

引用和强调

4b2453e4cfe7385419a4a758b5b9af5.jpg

语义化

语义化是什么

8f8d75f281af88f73d416b49b5f47ee.jpg

谁在使用我们写的HTML

71287ecb5a7e17a7cde7e0bf5edaa80.jpg

传达内容而不是样式

语义化的好处

3370d895249909b12f98ee320b7a6b9.jpg

如何做到语义化

8f7e72227c99abfea360f2a3c5fc410.jpg