- 博客(27)
- 收藏
- 关注
RSS订阅原创 组件开发的环境准备
先安装pnpm工具包：npm install -g pnpm (npm install -g xxxx 全局安装工具包，可以直接在命令行使用，否则无法使用)Node.js 是一个开源的、跨平台的 JavaScript 运行环境，能够在服务器端执行 JavaScript 代码。【Node.js官网】 https://nodejs.org ==> 可复制该链接直接去官网下载。输入node -v查看安装的版本，若安装成功，则会显示安装的版本。pnpm包管理器的安装（全局安装）
2024-12-08 13:20:56
381
原创 项目实战：Vue3开发一个购物车
这段HTML代码实现了一个简单的购物车实战小项目的前端页面，结合了Vue.js框架来实现数据响应式和交互逻辑。页面展示了购物车中的商品项，每个商品项有增减数量的按钮，并且能显示商品总数以及目前固定为0元的商品总价和总价计算。【运用响应式数据内容】
2024-11-24 18:20:36
494
原创 项目实战：基于Vue3实现一个小相册
按照示例图做出一个简单的框架。利用v-bind绑定图片的路径，使得图片路径可以自动更新。通过v-on（@）为切换相片的按钮绑定一个函数，这个函数负责更改图片路径。把图片路径存储在响应式数据里，当这个响应式数据改变时，html的图片路径就会自动改变。
2024-11-23 21:46:31
480
原创 响应式数据（v-on、v-if、v-show、v-for、v-bind、v-model、computed、watch）
watch 的第一个参数可以是不同形式的“数据源”：它可以是一个 ref (包括计算属性)、一个响应式对象、一个 getter 函数、或多个数据源组成的数组。反过来，当这个数据对象的属性被程序修改，输入框显示的内容也会自动改变。v-bind指令虽然可以直接对class属性进行数据绑定，但如果将绑定的值设置为一个对象，其就会产生一种新的语法规则，设置的对象中可以指定对应的class样式是否被选用。v-if指令用于绑定一个表达式，当表达式为真时，对应的元素会被渲染到DOM中，如果为假，元素则不会被渲染。
2024-11-23 18:01:48
1433
原创 前端框架Vue3基础部分
Vue是一个能用于构建用户交互页面（动态网页）的渐进式JavaScript框架，易学易用，性能出色，适用性强的Web前端框架。
2024-11-19 23:24:52
621
原创 JavaScript案例-轮播图
第二步：创建JavaScript脚本，先获取图片的节点（getElementById、getElementByClassName）。屏幕录制 2024-11-11 093734。
2024-11-11 10:03:40
500
原创 【超详细！】JavaScript的事件监听（监听鼠标事件、监听键盘事件、监听表单事件）
在JavaScript中，事件监听用于检测页面上发生的特定事件，例如用户点击按钮、鼠标移动、键盘按键按下等。事件定义了用户与网页交互时产生的各种操作。1、第一个参数是要监听的事件类型，比如"click" (点击事件)、"mouseover"(鼠标移到元素上方事件)等，是字符串形式。2、第二个参数是当事件发生时要执行的函数。3、可选的第三个参数是一个布尔值。
2024-11-09 00:53:03
7701
1
原创 JavaScript-DOM编程（节点获取，节点属性修改，节点创建与插入，CSS样式的修改）【新手小白入！！！】
一、Dom节点获取DOM是document object model（文档对象模型的缩写）。DOM提供了一种结构化的方式来访问和更新网页内容，可以动态地添加、删除或修改网页中的元素和属性。使用JavaScript进行DOM编程，可以实现各种交互效果，比如响应用户的点击事件、更新内容、动画效果等。一、Dom节点获取。
2024-11-02 16:20:08
918
原创 JavaScript语法基础（函数，对象，常用类Array，String，Math和Date）【超详细！！！新手入！！！】
// 1.直接手动定义一个对象（而不是通过类实例化）firstName:"毛",lastName:"主席",age:83,eyeColor:"黑色",// 2.使用定义好的对象的属性console.log(person.eyeColor) //使用对象的属性
2024-11-01 23:39:09
703
原创 JavaScript语法基础-变量，数据类型，运算符，程序控制语句【新手小白轻松掌握！！！】
JavaScript是一种Web脚本编程语言，简称JS。脚本指的是一段程序，通常以解释的方式运行，无需编译，可以直接在浏览器端运行（称为客户端脚本）。在JavaScript中，语法的基础包括变量、数据类型、运算符、条件语句、循环语句、函数等。
2024-11-01 00:14:46
1219
原创 如何实现两列布局和三列布局？【新手入】
两列布局是一种常见的网页布局方式。一般情况下,此类页面布局的两列都有固定的宽度,而且从内容上很容易区分主要内容区域和侧边栏。页面布局整体上分为上、中、下3个部分,即header区域、container区域和 footer 区域。其中,container又包含mainBox(主要内容区域)和sideBox(侧边栏)。三列布局与两列布局相似，三列布局比两列布局多了一列内容，通常中间一列为较重要的内容。两列宽度固定是指div1和div2宽度固定。通过对div1和div2设置浮动实现。
2024-10-29 17:00:29
869
原创 CSS浮动、清除浮动
为了防止浮动溢出现象的出现而进行的CSS处理,叫作清除浮动。清除浮动即清除掉元素 float 属性。使用清除浮动不仅能够解决页面错位的现象,还能解决子级元素浮动导致父级元素背景无法自适应子级元素高度的问题。浮动可以使元素向左或向右移动，其周围的元素也会重新排列。float属性定义元素在哪个方向浮动,任何元素都可以浮动，而浮动元素就会变成一个块状元素。父盒高度塌陷后，会影响父盒兄弟盒的布局。浮动的元素会脱离文档流，漂浮在文档流上方，在文档流中不占位置，后边的元素向前移动。
2024-10-15 23:52:46
1415
原创 盒子的绝对定位
绝对定位（本体绝对移动，以上层元素为基准）是相对于最近的已定位的祖先元素进行定位偏移。如果没有已经定位的祖先元素,就以浏览器窗口为基准进行定位。，使用绝对定位后，水平方向可以通过right和left属性来指定，垂直方向可以通过top和bottom属性来指定。两个方向各选一个参数即可定位，定位的值可以为负数，要。以上可以比喻成排队的例子， 第一个人在排队，后面紧接着第二个人和第三个人，突然第二个人不想排了，走掉了，那么第三个人就继续往前排了。使用绝对定位（absolute）时，要将。
2024-10-13 13:50:53
593
原创 盒子的相对定位
在使用盒子的相对定位时，盒子相对的是自身原本在文档流中的位置，通过偏移自身的位置后（偏移值可以为负数），到达新的位置。相对定位不脱离文档流，即使元素偏移了位置，它原本所占的空间仍然保留在文档流中，不会影响其他元素的排列。使用相对定位后，图片之间可能会重叠。，还需要指定一定的偏移量。使用相对定位时，要将。
2024-10-13 10:34:46
375
原创 网页文档流-概念、缺陷
文档流指的是HTML中元素在计算布局排版的过程中,所有处于文档流中的元素会自动的。从左到右(非块级元素)从上到下(块级元素)
2024-10-12 19:55:21
299
原创 盒模型-属性
在CSS中，盒模型的属性包含了几个不同的区域：内容（Content）、内边距（Padding）、边框（Border）和外边距（Margin）。padding-border-margin模型是一个极其通用的描述盒子布局形式的方法。
2024-10-12 19:14:39
598
原创 CSS常用样式声明（属性）【字体、文本、图像、表格、表单】
text-decoration：underline （下划线）|| overline（上划线）|| line-through（贯穿线）|| blink（闪烁）|| none。它包含normal（默认字体）、bold（粗体）、bolder（粗体再加粗）、lighter（比默认字体细）、100、200、300、400、500、600、700、800和900多个属性值。（0.0~1.0：0表示完全透明，1表示完全不透明，0.5表示半透明）
2024-10-11 23:31:48
782
原创 CSS样式核心-选择器
CSS选择器是CSS中非常重要的一个概念，它决定了格式化将应用于哪些元素。常见的CSS选择器有标签选择器（如div、p）、类选择器（如.class类选择器）、id选择器（如#idname）。还有更复杂的组合选择器和伪类选择器，比如子代选择器、后代选择器、相邻兄弟选择器和通用兄弟选择器等。
2024-10-09 13:50:32
1475
原创 表单（input元素）
比如文本（text）、密码（password）、单选按钮（radio）、复选框（checkbox）、提交按钮（submit）、重置按钮（reset）、文件选择（file）、隐藏（hidden）等等。在Web中，表单是一个非常重要的元素，用于从用户那里获取信息，比如登录信息，搜索关键字，个人资料等等。HTML中的元素用于创建交互式的表单，以便用户向服务器提交信息。使用元素的type属性，可以在表单中加入表项。表单按钮有4种类型：提交按钮、重置按钮、普通按钮和图片按钮。
2024-10-01 13:04:00
811
原创 Web前端列表（有序、无序）、表格（规则、不规则）
表格的表头可用标签，标签的文字按粗体显示，标签按常规字体显示。使用标签的border属性可以为表格添加表框并设置边框宽度及颜色。无序列表就是列表中列表项的符号没有一定的顺序。有序列表是一个有特定顺序的列表项的集合。使用ol（ordered liste,有序列表）标签建立有序列表。表格有标签来定义。和标签都可指定符号的样式。type属性用来定义有序列表的符号样式。利用和的跨行跨列属性来实现。
2024-09-24 23:13:34
608
原创 Web图像属性、网页背景图像、路径
例如：将“猕猴桃.jpg”与当前代码文档放在同一个文件夹中，如图，代码所在位置为“2-1 图像，背景，超链接.html”,我们要通过相对路径找到“猕猴桃.jpg”,那我们直接跳出“2-1 图像，背景，超链接.html”，就可以找到“猕猴桃.jpg”。例如：“葡萄.jpg”存放在"D:\vsd\图像，超链接，书签链接"目录下，即该图片的绝对地址就是"D:\vsd\图像，超链接，书签链接\葡萄.jpg"。在HTML中，用标签在网页中添加图像，将图像嵌入到网页中。HTML中的链接的专业叫法是“锚点”。
2024-09-20 15:53:50
708
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人