自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(21)
  • 收藏
  • 关注

原创 组件开发的环境准备: nodejs安装,npm镜像源的修改,pnpm包管理器的安装(全局安装),基于pnpm创建脚手架项目

1. Vue - Official (Vue官方插件,强烈推荐,默认的xxx.vue文件是没有语法高亮的,都是一片白色,不利于阅读,安装这个插件以后,语法就会高亮)这个文件,把App.vue这个文件的内容全部删掉,输入v3(vbase-3-setup),按回车(把画圈的地方删掉)Node.js安装的时候一直按next就可以了,直到最后按finish就完成安装了,效果如下图。【设置淘宝镜像源(默认镜像源是国外网址,国内访问经常失败,所以要设置淘宝镜像源)】这样基本就完成了,只需要再输入内容就可以运行了。

2024-12-08 15:50:10 686

原创 前端框架Vue3项目实战(基于Vue3实现一个小相册)

console.log(`用户点击第${img.index}张按钮,显示第${img.index}张照片`);console.log(`用户点击第${img.index}张按钮,显示第${img.index}张照片`);console.log(`用户点击第${img.index}张按钮,显示第${img.index}张照片`);<img src = "./img_src/logo1.png" class="img" alt="图片加载失败">/* 忽略前面盒子浮动带来的影响,解决父盒高度塌陷问题 */

2024-11-30 16:26:57 1562 1

原创 前端框架Vue3的响应式数据,v-on,v-if,v-for,v-bind

= 100 && web.user < 1000">优秀网站

2024-11-24 19:12:52 1023

原创 JS的DOM操作和事件监听综合练习 (具备三种功能的轮播图案例)

第4张</p><p class="button" id="p4">第4张</p><p class="button" id="p2">第2张</p><p class="button" id="p2">第2张</p><p class="button" id="p2">第2张</p><p class="button" id="p2">第2张

2024-11-24 17:03:45 751

原创 JS的DOM事件监听 (鼠标事件,键盘事件,表单事件)

/ 阻止表单的“默认提交行为” (即:将数据发送到表单的 action 属性指定的 URL,并在那里进行处理))邮箱: <input type="email" id="email" value="在此处输入你的邮箱"> <br>姓名: <input type="text" id="name" value="在此处输入你的姓名"> <br>// 注意: selectionEnd 属性返回的是选择范围的结束位置的下一个字符的索引。/* 增加浏览器页面高度以便滚动 */

2024-11-10 18:21:47 738 1

原创 JS的DOM操作 (节点获取,节点属性修改,节点创建与插入,CSS样式的修改)

利用js修改CSS样式

2024-11-10 17:23:06 1169

原创 CSS的综合应用例子(网页制作)

就会不断执行循环体中的代码。// 当expression的值不等于任何case的值时执行的代码块。// 当expression的值等于value1时执行的代码块。// 当expression的值等于value2时执行的代码块。当匹配成功时,就执行对应的代码块,直到遇到。// 当condition1为真时执行的代码块。// 当condition2为真时执行的代码块。// 当以上条件都不满足时执行的代码块。的值,否则可能会导致无限循环。// 当条件为真时执行的代码块。// 当条件为假时执行的代码块。

2024-11-10 13:17:33 1299

原创 JS语法基础(变量,数据类型,运算符,程序控制语句)

这些程序控制语句是 JavaScript 编程中非常重要的部分,它们能够帮助程序员根据具体的业务需求灵活地控制程序的执行流程。// 当expression的值不等于任何case的值时执行的代码块。// 当expression的值等于value1时执行的代码块。// 当expression的值等于value2时执行的代码块。后面的代码,即不会输出 5,但循环会继续进行,输出其他数字。// 当condition1为真时执行的代码块。// 当条件为真时执行的代码块。// 当条件为假时执行的代码块。

2024-10-29 17:45:45 517

原创 CSS的两列布局、三列布局和多行多列布局

width: 30%;width: 70%;这是左侧列的内容。这是右侧列的内容。

2024-10-27 15:21:36 1517

原创 盒模型的浮动和清除浮动

元素,并设置其 clear 属性为 both ,以清除浮动的影响。盒子1盒子2盒子1盒子2

2024-10-19 17:42:14 813

原创 盒模型的属性、大小、定位

1. 标准盒模型:总宽度 = 内容宽度(width)+ 左右内边距(padding-left + padding-right)+ 左右边框宽度(border-left-width + border-right-width)+ 左右外边距(margin-left + margin-right);1. position :用于设置元素的定位方式,可选值有 static (默认值,无特殊定位)、 relative (相对定位)、 absolute (绝对定位)、 fixed (固定定位)。

2024-10-19 16:25:25 945

原创 CSS盒子的绝对定位(排队例子)

在 CSS 中,绝对定位(absolute)可以将元素从正常的文档流中移除,并相对于其最近的已定位祖先元素进行定位,如果没有已定位的祖先元素,则相对于文档的初始包含块进行定位。在这个例子中, .box 元素将相对于其最近的已定位祖先元素(如果没有,则相对于文档的初始包含块)向上移动 20 像素,向左移动 30 像素。2. 精确布局:当需要对元素进行非常精确的定位,且不希望受到其他元素的影响时,可以使用绝对定位。1. 绝对定位的元素脱离正常文档流,不占据空间,其他元素会忽略它的存在进行布局。

2024-10-19 16:11:48 534

原创 CSS盒子的相对定位和固定定位

2. 作为绝对定位的参考元素:如果一个元素设置为绝对定位,并且希望以另一个元素为参考进行定位,那么可以将参考元素设置为相对定位。这样,绝对定位的元素就会相对于相对定位的元素进行定位。相对定位的元素,会在原先的位置留坑,即元素还是在原来的位置,只不过渲染在新的地方,不会对页面其他元素产生任何影响。在 CSS 中,相对定位(relative)是一种定位方式,它允许你相对于元素在正常文档流中的位置进行偏移。1. 微调元素位置:当你需要对元素进行轻微的位置调整,而又不想破坏文档流的布局时,可以使用相对定位。

2024-10-19 15:40:02 735

原创 CSS网页文档流的概念和缺陷

每个元素的位置都会受到前面元素的影响,如果前面的元素发生位置变化,那么后面的元素的位置也会发生相应的变化。

2024-10-12 16:36:40 928

原创 CSS盒子模型

盒子模型本质上是一个盒子,封装周围的HTML元素,它包括:边距,边框,填充,和实际内容。<img src="./风景.jpg" id="img1">可以同时操作,代码:border:10px blue solid;(注:border-radius分别控制盒子四个角弧度是按。可以同时控制四个边距(padding:10px)清除内容周围的区域,内边距是透明的。清除边框外的区域,外边距是透明的。padding(内边距)margin(外边距)content(内容)border(边框)的厚度,颜色,样式)

2024-10-12 15:29:02 496

原创 CSS的字体、文本和图像样式和例子

靠右对齐,上划线,单词首大写字母</p><img src="./风景.jpg" id="img1"><p id="p1">靠左对齐,下划线,大写字母</p><p id="p2">居中对齐,删除线,小写字母

2024-10-12 14:24:20 713

原创 (续)CSS选择器的一些应用

点击这里人物介绍人物关系表剧情简介人物结局演员表链接辰此一生不负天下为负十一

2024-10-08 21:18:45 494

原创 (常用)CSS的选择器

剧情简介剧情简介剧情简介内容人物关系表剧情简介人物结局剧情简介演员表各演员信息

2024-10-08 21:00:08 762

原创 HTML的内容应用练习

各演员信息周生如故版权所有©作者

2024-09-30 18:26:14 551

原创 (常用)HTML的图像、超链接、列表、表格和表单

主要表示表头表内容

2024-09-30 16:29:56 372

原创 HTML基本骨架、段落、换行、水平线、文本标签

需要的内容设置水平线的对齐方式(默认居中。这是一个段落这是另一段落

2024-09-08 19:14:07 241

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除