前端与 HTML | 青训营笔记

489 阅读2分钟

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

1.课程要点:

  • 前端的三大语言:html,css,javasript,它们分别在前端的作用是内容,样式与交互功能的实现。
  • 前端的html:即hyertext markup language意为超文本标记语言。
  • 前端应该关注的几大方面:美观,性能,功能,安全,兼容,无障碍等。
  • 前端的开发环境:现代浏览器(微软浏览器,火狐浏览器等),编辑器(vim,vscode,webstorm等)。
  • 前端的一些重要元素的介绍:如p即paragraph的缩写,代表着段落的标记元素,a即anchor的缩写,代表链接元素,href即hyperreference的缩写。

2.知识点介绍:

  • HTML 语法:标签和属性不区分大小写,推荐小写,空标签可以不闭合,比如 input、meta,属性值推荐用双引号包裹某些属性值可以省略,比如 required、readonly。
  • 语义化:HTML中的元素、属性及属性值都拥有某些含义开发者应该遵循语义来编写HTML有序列表用 ol;无序列表用 ul,此外dl即difine list 表示定义列表里面含属性与属性值,lang 属性表示内容所使用的语言。
  • 谁在使用我们写的HTML:
    • 开发者 - 修改、维护页面
    • 浏览器- 展示页面
    • 搜索引擎-提取关键词、排序
    • 屏幕阅读器- 给盲人读页面内容

3.个人尝试编写html代码

<html>
  <head>
    <meta charset="utf-8">
    <title>My test page</title>
  </head>
  <body>
    <h1>Hi,there!</h1>
    <p> 这是我的第一个html网页</p>
    <h2>这是第二个标题,以下是一个超文本链接</h2>
    <a href="https://juejin.cn/">
    </a>
    <p>My heart is <strong>very</strong> powerful.</p>
  </body>
</html>

其运行结果如下:

Hi,there!

这是我的第一个html网页

这是第二个标题,以下是一个超文本链接

My heart is very powerful.

3.小结:

前端技术的边界随着时代的发展人仍然在逐渐拓宽,作为一个合格的前端学习者,我们应当也跟上步伐,坚持学习先进前端技术。