HTML网页结构的基础,用来组织文字、图片、链接、表单等内容。
和我进入超文本标记语言的世界看看
点击按钮,进入超文本标记语言标签的世界
感谢各位标签、属性和语法单位参加本次 520 特别演出。它们刚刚从屏幕边缘赶来,先聚拢,再被炸飞,最后又认真拼出了 HELLO WORLD。下面为本次出场成员的功能介绍,请各位观众按需认识。
HTML网页结构的基础,用来组织文字、图片、链接、表单等内容。
CSS控制网页外观,例如颜色、布局、字体、间距、动画和响应式适配。
JSJavaScript,让网页产生交互,例如点击、动画、数据处理和页面切换。
<div>通用容器标签,常用于包裹页面模块和配合 CSS 做布局。
<p>段落标签,用来展示一段文字内容。
<hr>水平分割线,常用于分隔不同内容区域。
<a>超链接标签,可以跳转到网页、锚点、文件或联系方式。
<img>图片标签,通过 src 属性显示图片。
<ul>无序列表容器,通常和 li 搭配使用。
<li>列表项标签,用来写列表中的每一项。
<nav>导航区域标签,常用来放菜单、链接和页面导航。
<main>页面主体内容区域,一个页面通常只放一个主要 main。
<section>内容分区标签,用来划分页面中的独立模块。
<header>头部区域,常放标题、Logo、导航等内容。
<footer>底部区域,常放版权、备案号、链接等信息。
<button>按钮标签,常用于触发点击事件。
<input>输入框标签,可输入文本、密码、数字、文件等。
<form>表单标签,用来收集并提交用户输入的数据。
<span>行内容器,常用于给一小段文字单独设置样式。
<canvas>画布标签,可以用 JavaScript 绘制图形、动画和小游戏。
<script>脚本标签,用来引入或编写 JavaScript 代码。
<style>样式标签,用来在 HTML 页面中直接写 CSS。
<meta>元信息标签,用来设置字符集、视口、SEO 信息等。
flex弹性布局,适合做横向、纵向排列和居中对齐。
grid网格布局,适合做复杂的二维页面布局。
hover鼠标悬停状态,可以做按钮高亮、卡片浮起等效果。
keyframesCSS 动画关键帧,用来定义动画从开始到结束的变化。
transform变换属性,可实现移动、旋转、缩放、倾斜。
transition过渡动画,让属性变化更平滑。
query通常指查询元素或数据,例如 querySelector 查询页面元素。
event事件,例如点击、输入、滚动、加载等用户或浏览器行为。
constJavaScript 常量声明,声明后不能重新赋值。
letJavaScript 变量声明,适合声明会变化的数据。
DOM文档对象模型,JavaScript 通过它操作页面元素。
API接口,前端可通过 API 和浏览器能力或后端数据交互。
JSON常用数据格式,前后端传输数据时经常使用。
PromiseJavaScript 异步处理对象,常用于请求、定时和异步流程。
async声明异步函数,通常配合 await 使用。
await等待异步任务完成,让异步代码写起来更像同步代码。
body网页可见内容的主体区域。
head网页头部信息区域,常放标题、样式、meta 等。
class类名属性,常用于给元素绑定 CSS 样式或 JS 查询。
id唯一标识属性,通常用于定位页面中的某一个元素。
src资源地址属性,常用于图片、脚本、视频等资源路径。
href链接地址属性,常用于 a 标签跳转。
z-index控制元素层级,数值越大越靠上。