- 博客(65)
- 收藏
- 关注
RSS订阅原创 HTML+CSS练习题目1--用户评论卡片（涉及flex、圆形切割的头像...）
（1）如何判断哪个div需要判断标准当需要将多个子元素水平或垂直排列，并且希望它们自动调整间距和对齐时当需要创建一行或一列布局，而不是默认的块级元素堆叠时当需要均匀分配空间或控制元素在容器中的位置时（2）flex: 1的具体作用让该元素占据剩余的所有可用空间当容器大小变化时，这些元素会自动调整大小在有多个flex项时，flex: 1会使它们平分剩余空间。
2025-08-07 14:50:56
434
原创 前端学习11：节点(Node)与元素(Element)的深入理解
DOM中节点(Node)和元素(Element)的区别与联系：节点是DOM树的基本单位，包含12种类型（如元素、文本、注释等），而元素特指HTML标签节点（nodeType=1）。元素继承自节点，属于节点的子集。实际应用中，childNodes会返回所有节点，而children只返回元素节点。理解节点层次和元素特性对DOM操作至关重要，如获取文本内容时应使用textContent，处理子节点时需注意节点类型检查。
2025-07-31 16:14:31
938
原创 前端学习10：JavaScript-DOM操作之节点操作（增删改查）小白入门+案例实操
本文介绍了JavaScript DOM操作的基础知识，包括节点获取、创建、修改和删除等核心操作。主要内容有：1. DOM基础概念，包括DOM树结构和节点类型；2. 传统与现代获取节点的方法比较，如getElementById()与querySelector()；3. 节点创建与克隆方法；4. 内容修改的innerHTML与innerText区别；5. 节点删除与替换操作；6. 节点关系处理方法。通过多个小案例（如评论列表、动态元素操作等）帮助理解不同方法的实际应用和区别，适合有基础者复习或入门学习DOM操作
2025-07-31 12:08:59
631
原创 前端学习9：JavaScript--对象与原型
属性继承：通过父类.call(this, 参数)在子类构造函数中实现方法继承：通过子类.prototype = Object.create(父类.prototype)实现构造函数修复：必须手动设置子类.prototype.constructor = 子类原型链：实例通过__proto__指向原型对象，形成链式查找结构※3. class语法（ES6现代写法）// 构造函数：初始化动物名称// 原型方法speak() {console.log(`${this.name} 发出声音`);
2025-07-25 16:39:41
604
原创 前端学习8：JavaScript数据类型|声明变量|函数定义|函数参数|作用域（多个小练习上手）
JavaScript基础入门指南：数据类型、变量声明、函数与作用域。介绍了7种数据类型（数字、字符串、布尔值、null、undefined、Symbol、BigInt），对比了var、let、const三种变量声明方式的区别。详解三种函数定义方式（声明式、表达式、箭头函数）及其特性，包括函数提升、this绑定等。探讨了默认参数、剩余参数和解构参数等函数参数处理方式，并分析了全局、函数和块级三种作用域。最后通过多个实操练习帮助理解作用域链、函数提升等核心概念，适合有一定基础的学习者复习巩固JavaScript
2025-07-18 11:40:41
791
原创 前端学习7：CSS过渡与动画--补间动画 (Transition) vs 关键帧动画 (Animation)
CSS动画对比与实现：补间动画（Transition）和关键帧动画（Keyframe Animation）是两种常见的CSS动画技术。补间动画通过transition属性实现简单状态过渡，需触发条件（如:hover），适合按钮悬停等简单交互；关键帧动画使用@keyframes规则定义多状态动画，能精确控制每个时间点，支持循环播放，适合复杂动画如加载动画。文中通过按钮悬停特效和旋转加载动画两个案例，详细演示了两者的实现方法和核心属性，包括transform、transition、animation等关键参数的
2025-07-16 11:55:30
807
原创 前端学习6：CSS选择器优先级
header属性选择器.button:hover伪元素div::before[行内样式] [ID] [类] [元素]!important0注意： 避免过度依赖高优先级选择器（如内联样式或!important），以保持代码的可维护性。
2025-07-15 11:03:49
316
原创 前端学习5：Float学习（仅简单了解，引出flex）
1.为什么 .navbar ul里面要去掉默认的列表样式：list-style: none;2.为什么.navbar 需要使链接成为块级元素a display: block;/* 向左浮动 */float: none;/* 默认值，不浮动 */因为原本默认的样式是有三个点的，像无序列表的三个点，所以需要去除。/* 向右浮动 *//* 清除浮动 */元素会向左/右浮动，直到碰到父容器边缘或另一个浮动元素。的效果（类似杂志排版），后来被开发者用来做页面布局。父容器无法自动计算浮动元素的高度，导致布局错乱。
2025-07-14 18:35:54
361
原创 前端学习4：小白入门注册表单的制作（包括详细思考CSS、JS实现过程）
本文详细介绍了如何构建一个完整的用户注册表单，包含HTML结构、CSS样式和JavaScript验证功能。HTML部分使用表单标签和各类输入控件实现用户名、邮箱、性别选择、出生日期和密码输入等字段。CSS采用从外到内的设计思路，通过flex布局、阴影效果和响应式设计提升用户体验。JavaScript实现实时表单验证，包括字符长度检查、邮箱格式验证和密码一致性校验。整个表单提交时阻止默认行为，收集数据并进行最终验证，通过后显示成功提示并重置表单。该教程系统性地展示了从需求分析到功能实现的全过程，适合前端初学者
2025-07-11 10:21:44
956
原创 前端学习3--position定位（relative+absolute+sticky）
本文介绍了CSS定位(position)在下拉菜单中的实际应用。首先通过relative和absolute配合实现基本下拉效果，其中relative为absolute提供定位基准，absolute实现悬浮菜单。接着重点讲解了sticky定位的应用：通过设置max-height和overflow-y实现可滚动菜单，利用position:sticky和top:0让"不吃"选项固定顶部，并配合z-index保证层级关系。文章还指出了sticky失效的常见原因，如父元素overflow设置不当等
2025-07-08 19:22:18
785
原创 前端学习2--选项卡+下拉菜单-功能实现
本文介绍了前端开发中两个常见的交互功能实现：选项卡切换和下拉菜单。选项卡切换通过HTML结构、CSS样式（使用active类控制显示状态）和JavaScript逻辑（事件监听、类名操作）实现内容切换。下拉菜单则通过鼠标事件监听和show类控制显示/隐藏，文中还提供了纯CSS实现方案。这两个案例展示了DOM操作、事件处理和样式控制的核心技术，适合前端初学者实践学习。
2025-07-08 18:16:17
818
原创 前端学习1--行内元素 vs 块级元素（基础概念+案例实操）
本文摘要： CSS布局核心概念包含内外边距和元素显示类型。1）内外边距：padding控制内容与边框间距，影响元素尺寸；margin调节元素间距离，支持正负值和百分比，不影响自身尺寸。2）元素类型：块级元素独占整行（如div），可设宽高；行内元素同行排列（如span），仅水平边距有效。通过display属性可转换显示方式（block/inline/inline-block）。实战案例展示了如何运用这些特性制作卡片布局，其中inline-block兼具行内排列和块级样式控制的优势。（150字）
2025-07-08 11:55:00
487
原创 （第三篇）HMTL+CSS+JS-新手小白循序渐进案例入门
本文介绍了如何使用CSS过渡动画和JavaScript状态控制实现可折叠的历史面板功能。主要通过三个步骤完成：1)学习CSS过渡动画基础知识，使用transition属性实现平滑的展开/收起效果；2)掌握JavaScript的classList方法动态切换样式类，通过.toggle()方法控制面板状态；3)结合DOM事件监听，实现点击按钮时切换面板状态并更新按钮文本。最终实现了一个宽度可平滑过渡、按钮状态同步变化的历史记录面板，提升了用户体验。
2025-07-02 21:10:33
528
原创 （第二篇）HMTL+CSS+JS-新手小白循序渐进案例入门
Flexbox 是 CSS3 提供的一维布局模型，专门解决元素排列、对齐和分布空间的问题。Flex容器（书架）：设置了的元素（使容器成为Flex容器，子元素自动成为Flex项目）Flex项目（书本）：容器的直接子元素本次学习到了 事件监听+字符串操作+Flexbox 布局逐步深入学习+实践练手。期待我们的下一篇文章吧贝贝们，记得关注主包~完整代码下一篇给出！（因为想把这个功能完整做完）
2025-07-01 16:54:19
1051
原创 HMTL+CSS+JS-新手小白循序渐进案例入门
首先看整个 HTML 文档的基本结构，基本如下： - 这是文档类型声明，告诉浏览器这是一个 HTML5 文档。 标签 - 整个 HTML 文档的根标签，所有内容都包含在其中。 标签 - 包含文档的元数据，如标题、字符编码、引入的外部资源等。 标签 - 设置浏览器标签页上显示的标题。 标签 - 包含所有可见的页面内容，如文本、按钮、图片等。二、页面内容详解现在设计一个简易计算器1.0页面：就包括一个名称，一个输入框，一个“计算”的按钮。 - 创建一个区块容器，并将其中
2025-06-10 17:28:28
883
原创 Redis数据结构选择策略--String？Hash？怎么选？
选择依据优先级首先考虑数据访问模式（整体读写 vs 部分读写）其次考虑原子操作需求最后考虑内存效率（Hash对少量字段更高效）
2025-06-09 12:26:32
554
原创 三表查询SQL怎么写？----小白初学+案例引入
背景：接上一篇的数据库三范式设计为了从我们设计的三张表中联合获取完整的计算历史记录，我们来写下对应的SQL查询语句！首先确认整体的查询语句结构：abc）
2025-06-05 18:08:38
505
原创 数据库三范式设计---小白初学+案例引入
模拟一个简单版计算器，两位操作数运算，运算符号包括+-*/，目前是把这些数据存储到了MySQL数据库中，库为cal，表名为success，如图：输入关键字history可以进行查询操作： 使用数据库三范式设计，步骤如下：第一范式（1NF）：每个字段都是不可分割的原子值第二范式（2NF）：满足1NF，且非主键字段完全依赖主键（针对联合主键）第三范式（3NF）：满足2NF，且消除传递依赖（非主键字段间不能有依赖）需要记录的有：id，操作数1，运算符，操作数2，结果，耗时，创建时间主实体：计算记录（cal）
2025-06-05 17:28:53
456
原创 两个错误教训记录--java变量作用域问题导致变量值异常
但是发现result无法存入数据库，进行多次debug后发现在进行计算方法calculate（）后，result是有数据的，即result=16。后面终于找到出错位置了！即图中框起来的两个，第一个输出语句是result=16，而到了第二个就变成了result=0了，怀疑是重新赋值了....后面终于解决了，其实就是这里的result我又重新定义了一遍，把前面的double去掉，在最外层定义result即可。设计了用户输入4*4，然后数据库可以存储number1和number2和result，即4,4,16；
2025-06-05 14:58:14
282
原创 SQL-为什么缺少 COUNT(*) 会导致总行数返回1
数据放在数据库中，然后可以接受用户指定查询n条，就展示n条，但是如果用户输入的n大于数据库中实际的总数据，那就展示实际总数据。而我们表中第一条记录的id是1，所以无论表中有多少条记录，都只返回第一条记录的id值。为true，返回的是第一条记录的id值。是普通查询，返回多行多列的结果集。是聚合函数，返回单行单列的结果。时，查询所有字段的所有记录。单行单列，值为总记录数。多行多列，所有记录数据。
2025-06-04 19:45:29
471
原创 leetcode合并两个有序数组-小白解法+进阶解法
注意，因为 m = 0 ，所以 nums1 中没有元素。nums1 中仅存的 0 仅仅是为了确保合并结果可以顺利存放到 nums1 中。,5,6] ，其中斜体加粗标注的为 nums1 中的元素。最终，合并后数组不应由函数返回，而是存储在数组。需要合并 [1,2,3] 和 [2,5,6]。需要合并的数组是 [] 和 [1]。个元素表示应合并的元素，后。需要合并 [1] 和 []。中，使合并后的数组同样按。合并结果是 [1]。合并结果是 [1]。冒泡排序时间复杂度是。
2025-06-04 14:40:05
235
原创 leetcode删除排序链表中的重复元素-小白初学简单解说
遍历链表时为什么需要新定义一个current？不能直接使用head？-----因为直接使用head去遍历会导致直接修改head，后面的head指针也会不断后移，最终返回的不是原始链表的头节点了，而是链表最后一个节点（或null）。删除所有重复的元素，使每个元素只出现一次。不变，始终指向链表的头部，最后返回。给定一个已排序的链表的头。指针遍历链表，而保持。（只需遍历一次链表）。
2025-06-04 11:18:53
242
原创 使用cmd命令行创建数据库和表-简单步骤记录
前提：前提：已安装MySQL步骤：1.Win+R，回车，输入cmd，回车2.输入 mysql -u root -p后，输入自己的密码，看到welcome等字样就是成功登录了MySQL3.创建数据库为数据库名）4.进入数据库 use logindemo5.创建success表6.查看表是否创建成功 desc user;7.去Navicat看看。
2025-06-03 12:24:33
346
原创 使用cmd来创建数据库和数据库表-简洁步骤
1. 按Win+R打开“运行”，输入cmd，回车2. 登录数据库：然后输入密码3. 创建数据库为数据库名(自定义你的数据库名)！注意分号不要漏了！4. 进入数据库5. 创建t_blog表 (自定义你的数据库表名)6. 查看表是否创建成功也可以看下Navicat中有没有创建成功：按照这个方法继续去创建别的表就可以啦~~~~~~
2025-04-27 14:52:45
527
原创 小白入门JVM、字节码、类加载机制图解
Java 运行环境JRE = JVM + Java 的核心类库[类]包括Java 虚拟机(JVM Java Virtual Machine)和Java 程序所需的核心类库等，如果只想运行开发好的.class 文件只需要JRE。也称最小运行环境。只运行。
2025-04-08 12:22:19
1236
原创 JAVA学习小记之IO流04--转换流篇
按照A规则存储，同样按照A规则解析，那么就能显示正确的文本符号。反之，按照A规则存储，再按照B规则解析，就会导致乱码现象。转换的原因是：有的文件并非是按UTF-8编码，那么在读文件内容时可能就会乱码，此时需将字节流转为字符流（更好地读取中文），并选取恰当的编码方式，从而避免乱码~~~
2025-04-03 11:37:37
513
原创 JAVA学习小记之IO流03--缓冲流篇
在创建流对象时，会创建一个，所以从具体设备上获取数据时会将数据的数组内，，减少系统IO次数，提高了读写的效率。字节缓冲流运行结果：运行结果：对比效果不是很明显哈。。。。但是你们能get到就行，你们可以用大一点的去尝试。
2025-04-02 20:00:13
931
原创 JAVA学习小计之IO流02--字符流篇
可以看到使用flush后流对象可以继续使用，成功写入刷新，但是使用close后流对象不可以再被使用了！的问题（读中文会乱码），比如应对中文，每次就是读入一个字，而字节流在此情况下可能一次读取不了一个字，因为一个字不止一个字节。新建文本，名字为read，路径为D:\\code\\JavaDemo\\read.txt，内容为我是一个冷漠无情的机器人。： 创建一个新的 FileWriter，给定要读取的文件的名称。字符流的由来：因为数据编码的不同，因而有了对字符进行高效操作的流对象，流对象不可以再被使用了。
2025-04-02 18:25:46
628
原创 JAVA学习小计之IO流01-字节流篇
字节流字符流。和。其他设备内存内存其他设备上面这四个类衍生出一系列类，它们是最根本的，但它们都是抽象类，需要其子类来实现其方法。PS：我们必须明确一点的是，一切文件数据(文本、图片、视频等)在存储时，都是以二进制数字的形式保存，都一个一个的字节，那么传输时一样如此。所以，字节流可以传输任意文件数据。在操作流的时候，我们要时刻明确，无论使用什么样的流对象，底层传输的始终为二进制数据。
2025-04-02 17:02:25
1001
1
原创 leetcode-HOT100--哈希表--两数之和
暴力解法需要两层循环（O(n²) 时间复杂度），而哈希表可以。，将查找时间降到 O(1)，整体复杂度优化到 O(n)。如果不存在，将当前数字及其下标存入哈希表，供后续查找。假设每种输入只有唯一解，且同一个元素不能重复使用。：只需遍历一次数组，每次哈希表操作为 O(1)。，表示找到的两个数的位置。如果存在，直接返回当前下标和互补数的下标。），而数组是存储多个整数的最简单结构。题目中的数组元素是整数（如。：初始化数组元素，直接填充值。，并返回它们的数组下标。虽然下标不会为负数，但。：创建一个新的整数数组。
2025-04-02 11:20:55
921
原创 Java小记---反射
反射之中包含了一个「反」字，所以想要解释反射就必须先从「正」开始解释。一般情况下，我们使用某个类时必定知道它是什么类，是用来做什么的。于是我们直接对这个类进行实例化，之后使用这个类对象进行操作。上面这样子进行类对象的初始化，我们可以理解为「正」。它在未运行时就已经确定了要运行的类（即Apple）。而反射则是一开始并不知道我要初始化的类对象是什么，所以自然也无法使用 new 关键字来创建对象了。可知：反射就是在运行时才知道要操作的类是什么，并且可以在运行时获取类的完整构造，并调用对应的方法。
2025-03-27 11:40:22
675
原创 Java学习小记--泛型
在类名后加上（不限个数），然后用于修饰类的方法/属性/返回值，在类实体化时赋予其相应的实际类型// 键值对// 定义一个泛型类，可以存储任意类型的键值对class GenericStorage<K, V> { // K代表键的类型，V代表值的类型/*** 存储键值对* @param key 键* @param value 值*//*** 根据键获取值* @param key 键* @return 对应的值*//*** 显示所有存储的内容*/
2025-03-26 18:26:33
682
原创 Windows在 GitHub 上拉取（Clone）项目到本地电脑的完整步骤
（1）打开IDEA，点击左上角“文件”---“打开”----“选择项目路径”----“确定”------>检查是不是防火墙阻止了 Git 的请求。----->把Git加入白名单即可。（1）打开 GitHub 网站（已登录），找到你要拉取的项目（如。（1）在你要放置项目的路径下，打开。（2）点击绿色的 Code。方式，复制 URL（如。已经安装下载Git。
2025-03-25 16:47:15
2589
原创 当输入没有注册的用户名和密码，直接跳转到了一个404页面是怎么回事
当我输入没有注册的用户名和密码，直接给我跳转到了一个404页面，而不是显示提醒弹窗“账号或密码错误！
2025-03-12 18:30:27
506
原创 两种方式通过Python代码脚本的方式获得已连接设备号
我们可以在命令行使用adb命令“adb devices”得到我们已经连接好的设备号：但是我们现在想通过Python代码脚本的方式获得设备号，该怎么做呢~？（我们用脚本去得到设备号有利于以后脚本写别的内容，先做好基础）
2024-12-18 15:11:36
567
原创 移动端自动化Auto.js入门及案例实操
前提： Appium 和 Airtest 编写的自动化脚本都依赖于 PC 端运行，没有办法直接运行在移动端。
2024-12-10 15:03:04
6711
6
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人