【字节第二届青训营】01.16 前端与HTML

01 前端

前端定义

前端指的是网站前台部分，是运行在PC端，移动端等浏览器上展现给用户浏览的网页。解决的是图形界面下的人机交互问题。

技术栈

• JavaScript(行为)
• CSS（样式）
• HTML(内容)

关注问题

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

02 HTML

HTML定义

HyperText Markup Language（超文本+标记语言）

DOM树

当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）

基本语法

• 标签和属性不区分大小写，推荐小写
• 空标签可以不闭合，比如 input、meta
• 属性值推荐用双引号包裹
• 某些属性值可以省略，比如 required、readonly

常用标签

标题标签：应用于标题文本，而不是为了产生粗体文本而使用。

文本标签:

引用标签：

Code标签:

列表标签：

1. 无序表
2. 有序表
3. 定义表

链接标签：

<a href="url" target="_blank" > Link text </a>

其他：多媒体标签、输入文本、选择标签等。

内容划分

div 元素可以把文档分割为独立的、不同的区域，每个区域就相当于一个块级容器，其中可以放置段落、标题、表格、图片、乃至任何HTML元素。

语义化

• 定义： 根据内容的结构化，选择合适的标签
• 优点： 有利于开发者的阅读、开发和维护，方便设备解析，提升用户体验感