CSS动画学习笔记
CSS动画学习笔记 CSS动画概述 CSS动画（CSS Animations）允许通过指定关键帧来创建复杂的动画效果。 与过渡的区别： transition 需要用户交互触发，且只能定义起始与结束状态。 animation 支持自动播放动画，且可以自定义多个关键帧。 CSS动画语法 animation属性（简写形式） .box { animation: fa...
结果
30 条CSS优先级及变形学习笔记
CSS优先级及变形学习笔记 CSS优先级 样式继承 某些样式属性（如color）会自动继承父元素的样式。 例如： <div class="wrap"> <p>Hello World</p> </div> <style> .wrap { color: red; } </style> 结果：<p>标签中的文本会继承.wrap的color属性。 样式优先级 浏览器...
在 Vue 3 中使用 tsParticles 的深度解析
在 Vue 3 中使用 tsParticles 的深度解析 tsParticles 是一个强大的粒子特效库，能够创建交互式的动态粒子效果，通常用于网站背景、装饰或是特定页面的动态元素。我们将在这篇文章中深入探索如何在 Vue 3 中使用它，解析每一个重要的配置项，并给出实际应用场景。 安装和引入 tsParticles 首先，我们需要在 Vue 3 项目中安...
anime.js动画库是什么？
使用 anime.js 动画库 anime.js 是一个轻量级的 JavaScript 动画库，可以帮助开发者创建高性能、复杂的动画效果。本指南将向您展示如何在项目中使用 anime.js，并提供一些常见的动画示例。 安装 在开始使用 anime.js 之前，首先需要安装该库。您可以使用 npm 或 yarn 进行安装。 npm install animej...
HTML 最简单的入门，没有之一！
HTML简介入门HTML（HyperText Markup Language，超文本标记语言）是构建网页的基础语言，提供了描述网页结构和内容的方法。通过HTML，我们可以创建标题、段落、列表、链接、图像等各种元素，使网页具备内容和基本布局。本文将带你深入了解HTML的基本结构、常用标签及相关知识，帮助初学者快速入门。什么是HTML？HTML是一种标记语言，用...
CSS弹性盒子学习笔记
CSS弹性盒子学习笔记什么是Flexbox？Flexbox (Flexible Box) 是CSS3引入的一种用于布局的模式。提供了一种简便且强大的方式，用于在网页中进行一维布局。Flexbox特点：适用于一维布局（水平或垂直）。由父容器（flex容器）和子元素（flex项目）组成。自动适应不同屏幕尺寸，常用于响应式设计。Flex容器激活Flex容器使用di...
什么是分层解耦，什么是三层架构，一篇文章告诉你！
分层解耦(重点) 1. 分层解耦是什么 定义：分层解耦指的是将系统拆分成多个层次，每一层都有特定职责，并彼此隔离。这种方法能让各层独立演变，降低模块间的耦合，提升系统的可维护性。 内聚：软件中各个功能模块内部的功能联系。 耦合：衡量软件中各个层/模块之间的依赖、关联的程度。 软件设计原则：高内聚低耦合。 常见分层（三层架构）： 表现层（Controller...
HTML表单学习笔记
HTML表单学习笔记HTML表单概述HTML表单用于在网页上创建用户输入的界面，常用于用户交互，如注册、登录等功能。表单的基本组成表单域：通过<form>标签创建一个表单。表单控件：如文本框、单选框、复选框、按钮等。提示信息：用于指引用户填写表单的说明文字。示例代码：<form action="submit.php" method="POST"> <labe...
什么是maven？什么又是 spring
什么是maven？ Maven是apache旗下的开源项目，是一款用于管理和构建java项目的工具。 maven的作用？ 用于管理依赖jar包，避免版本冲突。 在IDEA里创建Maven项目 这些 Archetype 的区别 maven-archetype-archetype 用于创建一个新的 Archetype 项目本身，主要用于定制自己的项目模板。 生成...
HTML基本元素学习笔记
HTML基本元素学习笔记HTML元素HTML 文档结构：HTML 文档由相互嵌套的 HTML 元素构成。HTML 元素定义：由一对双标记（如 <p></p>）或单标记（如 <br>）表示。元素的内容是开始标签与结束标签之间的内容。示例代码：<!DOCTYPE html> <html lang="zh"> <head> <title>HTML元素示例</tit...