默默学前端-优快云博客

原创 CSS盒子模型（一）---保姆教学

CSS盒子模型是网页布局的核心概念，由内容(content)、内边距(padding)、边框(border)和外边距(margin)组成。标准盒子模型中，width/height仅指内容尺寸，使用box-sizing: border-box可让元素总尺寸固定。边框可通过border-radius设置圆角，内/外边距支持单边或多边设置。外边距可实现水平居中(margin:0 auto)，但嵌套元素会出现外边距塌陷问题，可通过添加边框、内边距或overflow:hidden解决。掌握盒子模型是CSS布局的关键基

2025-12-18 20:33:18 899

原创 CSS伪类及伪元素：一篇搞懂

本文介绍了CSS中伪类与伪元素的区别与应用。伪类（以单冒号开头）用于选择元素的特定状态，如链接状态（:link、:visited）、用户交互（:hover、:focus）和结构位置（:first-child、:nth-child）。伪元素（推荐双冒号）则针对元素的部分内容，如::before/::after插入内容、::first-letter修饰首字母。两者关键区别在于作用对象和语法标记，其中伪元素常配合content属性生成虚拟内容。文章通过多个代码示例演示了各类伪类和伪元素的具体用法。

2025-12-16 13:49:40 930

原创 html列表标签及css列表属性

HTML提供了三种主要列表标签：无序列表<ul>（圆点符号标记）、有序列表<ol>（数字编号）和定义列表<dl>（术语与定义组合）。列表可通过CSS自定义样式，包括修改符号类型、移除符号、使用图片标记或伪元素实现高级样式。还支持多级嵌套，不同层级可设置不同样式。关键CSS属性包括list-style-type、list-style-image和list-style-position等，通过选择器层级可精确控制嵌套列表的显示效果。

2025-12-15 22:10:07 596 1

原创 [前端]深入理解W3C标准与ES规范

本文介绍了前端开发的两大核心标准：W3C标准和ES规范。W3C标准主要包含HTML（定义网页结构）和CSS（控制样式表现），以及相关Web API；ES规范则是JavaScript的语言标准，定义了语法和核心功能。文章详细解析了两者的具体内容和发展历程，并通过代码示例展示它们如何协同工作：HTML搭建页面结构，CSS控制样式，JavaScript实现交互逻辑。最后强调两者共同构成前端开发基础，开发者需要同时掌握才能在Web舞台上"表演"。

2025-10-22 12:27:21 1009

原创《Vue知识点6内置指令与自定义指令》

本文总结了Vue的内置指令和自定义指令的使用方法。内置指令包括v-text、v-html、v-cloak、v-once和v-pre，分别用于文本渲染、HTML渲染、解决双花括号问题、一次性渲染和跳过编译。自定义指令可以通过局部或全局方式定义，支持bind、inserted和update三个回调函数。文章还强调了v-html的安全风险，并提供了自定义指令的命名规范和使用示例，帮助开发者更好地理解和应用Vue指令系统。

2025-09-15 09:09:34 1087

原创《Vue知识点5条件渲染与列表渲染》

本文介绍了Vue.js中的条件渲染和列表渲染两种重要功能。在条件渲染部分，详细讲解了v-if和v-show指令的使用场景及区别，v-if适用于低频切换且会移除DOM，v-show适合高频切换仅隐藏DOM。列表渲染部分重点解析了v-for指令的遍历应用，包括数组、对象等数据结构，并深入探讨了key的内部原理及其在性能优化中的关键作用。文章还通过代码示例展示了如何实现列表过滤功能，比较了watch和计算属性两种实现方式的差异。

2025-07-17 19:54:05 1610

原创《Vue知识点4监视属性与绑定样式》

文章摘要：本文介绍了Vue的监视属性(watch)及其应用场景。监视属性主要用于监听数据变化并执行自定义逻辑，适用于异步或高开销操作。配置项deep:true可实现深度监听对象/数组内部变化，immediate:true则在初始化时立即触发回调。通过天气案例展示了两种监听写法：Vue配置中的watch选项和vm.$watch方法，并对比了普通监听与深度监听的区别。深度监视需显式配置，适用于复杂数据结构，而单层属性变化可通过直接监听实现。文中提供了完整代码示例，演示了如何监听基础属性和嵌套对象的变化。

2025-07-16 21:55:28 868

原创《Vue知识点3事件处理与计算属性》

本文介绍了Vue事件处理的核心知识点：1）事件绑定语法v-on/@及其回调配置；2）6种常用事件修饰符（prevent/stop/once等）的功能与用法；3）键盘事件处理，包括按键别名、系统修饰键特性和自定义按键功能。文中通过多个示例演示了事件传参、阻止默认行为、事件冒泡控制等常见场景的实现方式，并强调了方法中this指向注意事项。内容涵盖Vue事件系统的基础使用方法，适合初学者系统学习。

2025-07-15 23:50:20 1669

原创《Vue知识点2MVVM模型与数据代理》

本文摘要：文章主要讲解了Vue.js中的MVVM模型和数据代理机制。内容包括：1）MVVM模型的三层结构（Model-View-ViewModel）及其通信原理；2）Object.defineProperty方法的使用，通过getter/setter实现属性监听；3）数据代理的概念，即通过一个对象代理操作另一个对象的属性；4）Vue实现数据代理的原理，通过Object.defineProperty将data属性映射到vm实例上，并自动生成getter/setter，使开发者能更方便地操作数据。文章通过代码

2025-07-14 21:36:30 578

原创《Vue.js 学习总结：Vue知识点1》

本文摘要：文章介绍了Vue.js的基础知识，包括初始Vue、模板语法、数据绑定以及el与data的两种写法。主要内容包括：1）Vue实例与容器的对应关系及基本配置；2）模板语法分为插值语法（{{}}）和指令语法（v-bind）；3）单向（v-bind）和双向（v-model）数据绑定的区别与应用；4）el可通过new Vue配置或$mount方法指定，data有对象式和函数式两种写法。适合Vue初学者系统学习基础概念。

2025-07-13 23:01:20 726

原创安装Node.js搭建Vue开发环境

本文详细介绍了Vue.js项目的完整搭建过程。首先从Node.js安装开始，提供了下载地址和安装步骤说明，并验证了安装成功。接着讲解了Vue项目的创建方法，通过npm init vue@latest命令初始化项目，并指导用户进行项目配置选择。文章还提供了两种在VSCode中打开项目的方式：命令行进入和直接拖拽。最后说明了项目依赖安装(npm install)和启动(npm run dev)的具体操作，并展示了项目成功运行的界面。整个教程步骤清晰，配有详细的截图说明，适合初学者快速上手Vue项目搭建。

2025-07-12 13:55:40 692

欢迎来到我的博客