- 博客(34)
- 收藏
- 关注
RSS订阅原创 弹性布局和网格布局的属性总结
align-self属性允许单个项目有与其他项目不一样的对齐方式，可覆盖align-items属性。默认值为auto，表示继承父元素的align-items属性，如果没有父元素，则等同于stretch。flex属性是flex-grow, flex-shrink 和 flex-basis的简写，默认值为0 1 auto。flex-shrink属性定义了项目的缩小比例，默认为1，即如果空间不足，该项目将缩小。flex-grow属性定义项目的放大比例，默认为0，即如果存在剩余空间，也不放大。
2025-04-01 17:35:05
722
原创 CSS层叠顺序
在 CSS 中，元素的层叠顺序决定了当多个元素重叠时（跟布局没有完全的关系，也就是说层叠顺序只会在几个叠放元素上进行比较，而不会改变布局），哪个元素显示在最上面，哪个元素显示在最下面。默认情况下，元素的层叠顺序是由它们在 HTML 中出现的顺序决定的——后出现的元素会覆盖前面元素的显示区域。但 CSS 提供了多个方式来调整这个顺序，确保元素按照特定的需求进行堆叠。视觉层叠在浏览器渲染页面时，如果多个元素的位置发生重叠，浏览器会根据它们的“层叠顺序”来决定哪个元素显示在上面。
2025-03-31 15:37:32
394
原创 01背包问题
我们可以将题目中的物品、价值、背包容量抽象成一个二维数组，以物品下标作为列头，背包容量作为行头，通过不断的填充这个二维的dp表格，我们可以找到最后一个位置，就是我们想要找到的在n件物品中 ，背包容量为total时的最优解。这个问题考察的方向是动态规划和贪心算法，通过降低问题的规模将复杂问题转换成简单问题，最终得到问题的解，该问题描述了一个有着最大容量限制的背包，在n件商品中找出可以放入物品的最大价值。通过表格将数据清晰的表现出来。实现一个算法求解 01 背包问题。
2025-03-30 09:03:59
255
原创 浏览器是如何工作的
目前，桌面设备上有五种主要浏览器：Chrome、Internet Explorer、Firefox、Safari 和 Opera。在移动设备上，主要浏览器包括 Android 浏览器、iPhone、Opera Mini 和 Opera Mobile、UC 浏览器、Nokia S40/S60 浏览器和 Chrome，其中除了 Opera 浏览器外，所有浏览器均基于 WebKit。我将举例说明开源浏览器 Firefox 和 Chrome，以及 Safari（部分开源）。根据StatCounter 统计数据。
2025-03-23 10:36:06
675
原创 pnpm和monorepo架构
pnpm是一个更快更小的软件包管理器，一般用于node_modules的相关包的安装，是对npm的改进。他可以在下载软件包之前先对依赖进行解析，然后对相同的包进行硬链接到你的项目中，避免了重复安装。
2025-03-10 08:55:00
645
原创 Webpack常见配置实例
自定义 Loader 和 Plugin 是 Webpack 的强大功能之一。它们允许我们实现更复杂的功能，如文件转换、代码生成等。自定义 Loader:Loader 实质上是一个函数，它接收源文件内容作为输入，并输出处理后的内容。可以通过 this.callback 返回结果。自定义 Plugin:Plugin 是一个类（ES6+），它包含 apply 方法。apply 方法接收一个 compiler 对象，通过这个对象你可以钩入 Webpack 的各个构建阶段。
2025-03-02 09:51:50
594
原创 Webpack打包构建流程
在前端有非常多的资源，如css、js、vue、vue、 图片、字体等。有些资源需要加工处理3. 图片 -> file-loader + url-loaderoptimization（webpack优化配置）splitChunksPlugin（优化配置的重要部分插件）分包和压缩代码，合并代码，代码分割，缓存，css提取。
2025-03-02 09:49:25
869
原创 CSS核心（上）
CSS由多组“规则”组成。选择器（Selector）：多个选择器可以半角逗号隔开。属性（property）：CSS1、CSS2、CSS3规定了许多的属性，目的在控制选择器的样式。值（value）：指属性接受的设置值，多个关键字时大都以空格隔开。属性和值之间用半角冒号隔开，属性和值合称为“特性”。多个特性间用;隔开，最后用大括号{ }括起来。CSS里现在共有5种基本选择器（Basic Selectors）和2种伪选择器。不同选择器的优先级别和运作性能往往存在差异。
2024-12-09 08:03:17
735
原创 css包含块
在css中一些属性的计算可能超出你的预料，在普遍情况下会认为定位属性和百分比的宽高是根据父元素计算的，但是准确来说他们都是根据元素所在的包含块来计算的，所以掌握包含块的知识是非常关键的。
2024-11-30 21:46:43
288
原创 vue3（下）
实现原理:通过对Object.defineProperty()对属性的读取，修改进行拦截。即数据劫持的操作进行监听，但是这样是有问题的，就是无法删除和添加属性（只是说加上或者删除的没有了响应式），而且无法捕获到通过修改数组下标对数组的更改。通过Proxy代理，拦截对象中任意属性的变化，包括属性的读取，修改、设置、删除。通过Reflect 反射对被代理对象的属性进行操作。首先在vue3中不会存在vue2里面的那两个问题。引入watch,可以监听数据变化并调用相应的回调。使用时需要引入 computed方法。
2024-11-24 15:58:29
273
原创 vue3（上）
组合式API的核心是setup函数，它是组件的入口点，所有的响应式API和组合式API都是在这个函数中使用的。v3也是支持一定的v2写法但是尽量不要在v3中书写v2的代码。
2024-11-17 15:49:21
790
原创 资源提示符
async插入js脚本时可以使用该提示符，并行js脚本加载和html文件的解析，在加载完成后会直接执行js暂停html的渲染defer插入js脚本的提示符，并行js脚本的加载和html的解析，在js加载完成后不会立即执行，会等待html解析完再执行。
2024-11-11 08:07:23
299
原创 vue路由
vue创建的是单页应用，需要使用路由进行页面跳转。单页应用的用户体验更好，不会造成页面跳转的抖动。router会监测网页路径的变化，通过监测不同路由路径来切换展示的组件。
2024-10-26 15:22:31
1093
原创 webpack
webpack是一个构建工具,实现了模块化管理项目.他的工作方式是用各种loader将各种资源转化为js文件或者对js文件进行压缩编译亦或对静态资源进行处理.
2024-09-22 20:50:58
820
原创 执行上下文
执行上下文对象包括全局和函数即eval三种，全局是在浏览器打开时会压入执行栈的最下部，等浏览器关闭后弹出，只有一个。他是一块地盘，一段代码所在的区域，是在代码编写时确定的静态的（不同于上下文对象）。函数执行上下文：存在无数个，只有在函数被调用的时候才会被创建，每次调用函数都会创建一个新的执行上下文。变量声明提升通过var定义（声明)的变量，在定义语句之前就可以访问到值：undefined。函数声明提升通过function声明的函数，在之前就可以直接调用值：函数定义(对象)由执行上下文栈管理执行上下文。
2024-06-02 21:25:49
211
原创 JS对象的基础及Math对象
JS是面向对象的语言，万物皆对象，对象实际上就是变量的容器，变量在对象中以键值对的形式书写，name:value;，存入的变量也叫做对象的属性。在对象内声明的功能性函数，即当属性值为一个函数时也叫做对象的方法，属性和方法都可以通过对象名打点调用。调用时不加括号将会导致返回函数的定义。对象可以用new创建。也可以直接用字面量。对象可以对数据进行统一管理。
2024-05-26 22:12:33
217
原创 HTML的表单
规定表单是否应打开自动完成（填写）功能，设置on后会根据以前填写的记录自动填充，设置off则不会。: 单行文本输入控件，当input框的type值为text时。： 密码输入控件也是单行文本输入，但一旦用户输入该字符，它就会屏蔽该字符。：单选框控件，在众多选项中，只需选择一个选项时，就会使用。规定提交表单时将表单数据发送到何处。标记可以创建下拉菜单，option标记可以作为选项。规定发送表单数据时要使用的 HTTP 方法。规定用于表单提交的字符编码。规定提交表单后在何处显示接收到的响应。
2024-05-19 09:57:47
366
原创 Js的数组方法
a.reduce（function（sum,number）{...},0）要有两个参数，第一个参数一定要初始化,0就是在初始化sum.方法的使用 arr.forEach（function（ 可使用参数，并在之后的大括号中使用该参数){ })a.every相当于&& 有不符合的直接返回false。将一个对象数组中的某些属性的值抽出来，组成一个新的数组。b.some 想当于|| 都不符合时返回false。6.reduce（ ）方法。代替map做一些简单的运算。
2024-05-12 16:24:45
328
原创 Js中的DOM操作
Document Object Model 文档对象模型可以通过JS操纵web网页，可以将页面所有东西转化为对象，以面向对象的方法操作。节点Node 是构成HTML最基本的单元。文档节点：整个HTML 文档 代表整个网页元素节点HTML文档中的标签属性节点 HTML中的文本内容onload 文档加载document 对象来加载读取节点属性 元素.属性名。
2024-05-05 11:37:51
321
原创 js数组【】
数组也是一种对象，他是用数字作为索引（index)操作元素代替属性名来操作属性值。数组的存储性能更好。创建：var arr=new Array( );//构造函数的方法用索引储存，a[index]来操作。数组中有一个length属性，它代表的是数组的长度，用arr.length 来操作这个属性，减少length的长度来删除末位元素。也可以用arr[arr.length]来添加元素。
2024-04-15 21:09:49
313
1
原创 CSS3基础
c3是css最新的标准，在一些落后的浏览器中并不支持，在C3中有了一些新的表现，如圆角、背景图片、渐变、动画、2D、3D、过渡等高级效果。
2024-03-24 15:46:46
215
3
原创 Html&CSS
这是一种层叠样式表，他负责网页的布局和表现，一般通过设置外部样式表，将结构与表现分开，这样极大提高了效率和后期维护的方便性，CSS通过选择器对HTML的元素进行调整和修改，并设定各种样式。在设计网页时最容易出现的情况莫过于高度塌陷和垂直外边距重合，当使用float时容易出现该情况，而对于这种情况有一个统一的解决方法。第二块是为了适应ie6，原理是在浮动元素后添加一个空的块以撑起元素，阻止塌陷。它并非是一种编程语言，而是一种超文本标记语言，用以描述网页的整体结构。
2024-03-17 16:31:28
142
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人