前端与 HTML | 青训营笔记

369 阅读2分钟

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

什么是前端

使用web技术栈解决多端通信及用户界面交互问题的工程师

前端的技术栈

  • html
  • css
  • js
  • 网路协议

前端需要解决的问题?

总:图形界面下的人机交互

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

前端的边界

  • nodejs 开发服务器端的应用
  • ELECTRON/React Native 开发客户端应用
  • webrtc P2P应用 多人会议
  • webGL 3d游戏
  • WebASSEMBLY c++、rust 代码编译成直接可以在浏览器运行的代码

HTML

HTML 简介

HyperText Markup Language 超文本 标签

<!doctype html>
我们当前的html文件使用的是哪个html的版本,浏览器会根据这个决定使用哪一种渲染模式 不写会用怪异模式

在一个标准的HTML文档中,必须要有以下几个标签:

  • <html></html>
  • <head></head>
  • <title></title>
  • <body></body>

常用标签

h1~h6 标题
ol li 有序列表
ul li 无序列表
dl dt dd 自定义列表
a 链接
img 图片
audio 音频
video 视频
input 输入(表单元素)特:textarea
select option 下拉框
datalist 输入提示
blockquote 长引用 cite 短引用 q 内容短引用 code 代码引用
strong 强调(警示 提醒) em 语气强调

内容划分

image.png

HTML 语义化

  • HTML中的元素、属性及属性值都有某种含义
  • 开发者应该遵循语义来表写HTML

个人总结

第一天的课程让我对前端这个职业有了更加深刻的理解,并且带我们回顾了html的相关内容,比如html这个单词的理解、html的常用标签、html的内容划分等等,这些内容帮助我巩固了对html的了解,我也了解到语义化的重要性,html还有一个非常重要的原则是传达内容,而不是样式。