自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 Ubuntu修改文件权限问题

Ubuntu中使用VSCode编辑文件后进行保存,权限不够怎么办?

2023-05-17 14:56:42 1102

原创 Gitee多人协作项目开发使用的git指令以及合并分支

Gitee多人协作进行项目开发使用的git指令:多人仓库创建完成之后就可以开始进行多人项目开发的工作了git指令及流程1.克隆仓库进入仓库,复制 SSH 地址执行 git clone SSH地址,将远程仓库克隆到本地 git clone [email protected]:xiaowuyb/CoperationDemo.git2.进入仓库,创建新项目,进行代码编写,编写完成之后执行git add .和 git commit -m '提交内容' git add . git commit -m

2020-07-25 08:31:37 6311

原创 Gitee多人协作进行项目开发的详细流程(创建多人仓库)

我们在使用GitHub时,最常遇到的问题就是网页加载速度慢或者是无法打开所以我们可以选择使用国内的Git代码托管平台——Gitee这也是我们进行多人协作项目开发的实用工具Gitee多人协作进行项目开发的详细流程:创建仓库,邀请新成员1. 组长新建一个仓库(如:CooperationDemo)2. 点击管理——仓库成员设置——开发者3.添加仓库成员 (最多不超过5人)4.通过链接或者二维码邀请新成员,或者可以自己手动添加新成员并提交,新成员在通知中心同意即可多人项目仓库创建完成

2020-07-24 20:09:50 8883

原创 Vue之购物车计算总价

用Vue实现一个购物车计算总价的功能代码html<div id="app"> <div class="panel panel-info"> <div class="panel-heading"> <h3 class="panel-title">购物车</h3> </div> <div class="pan

2020-07-08 22:25:21 5865 1

原创 谷歌json数据格式化插件

我们通过接口拿到的数据在浏览器的展示方式如下图:这种数据不方便我们直接观察,为了是数据结构更加的清晰,这里推荐一个谷歌浏览器插件 JSONView首先点击下载地址下载压缩包下载地址:https://github.com/wybaccount/JsonView下载压缩包之后解压,解压之后打开选中 WebContent 文件夹,点击扩展程序,打开右上角开发者选项之后,直接把文件夹拖入浏览器就安装成功了安装完成之后,刷新之前加载数据的页面就能够看到效果了...

2020-07-08 22:05:35 294

原创 解决文件夹无法删除的情况:文件夹正在使用,或已在另一个程序中打开...

在删除文件夹的时候,可能会遇到 文件夹正在使用,操作无法完成,因为其中的文件,或文件夹已在另一个程序中打开 的情况我分享一种能够解决此问题的方法:百度搜索 unlocker点击下载,再安装找到需要删除的文件夹,右键选择 unlocker 这个选项选择删除再点击确定就可以了...

2020-07-06 22:31:33 2349

原创 引用图片出现403的解决办法

访问图片出现403解决办法有时候在引用图片资源的时候会出现403(资源不可用)错误这里有一种解决的方案使用no-referrer方案,在前端页面头部添加一个meta标签<meta name="referrer" content="no-referrer" />而出现403的原因是因为有很多网站都会做安全验证会判断我们加载资源的来源,加上这句话可以让我们请求资源的时候不发送来源信息就可以解决403的问题,成功加载资源了—补充—这种方法适用于一部分网站, 不适用所有网站哦.

2020-07-04 18:12:17 1007

原创 CSDN超简单的上传gif动图方法

还不会上传gif图片?非常简单我们可以下载一个 gifcam 的软件,直接百度下载即可,就是下面这个下载好之后点击录制就ok,可以根据自己的需要调节大小还可以捕捉鼠标、全屏等操作,看个人需求了最后点击保存就ok了,之后就可以选择文件上传了。...

2020-06-30 22:52:50 1129

原创 jquery实现楼层滚动效果

效果图html <div id="floorNav"> <ul> <li>1F<span>服饰</span></li> <li>2F<span>美妆</span></li> <li>3F<span>手机</span></li> <li>4F<span>家电&

2020-06-30 22:21:55 366

原创 jquery实现点击按钮显示与隐藏效果

首先来看实现效果用jquery来实现这种效果是非常简单的html<div class="bottom"> <ul> <li class="active"> <span class="iconfont icon-yemian-copy-copy"></span> <p>首页</p>

2020-06-29 21:55:34 1238 1

原创 不会递归?递归方法奉上

递归如果你进一家公司,面试官问你递归的问题,那么他对你的要求就挺高了。但是很多公司有明文规定项目中不能使用递归!(黑人问号脸???)当我们学会递归以后就能明白这两句看似矛盾的话究竟是怎么回事了。进入正题!我们首先要知道什么是递归?递归满足以下三个特点:1、函数自己调用自己;2、一般情况下有参数;3、一般情况下有return我们要知道,递归能解决循环能做的所有事情,有一些循环不容易解决的事情,递归就能比较容易的解决递归都可以写出来,但是不知道为什么这么写就对。接下来上案例:计算1~n的

2020-06-28 22:02:48 423

原创 执行 git reset --hard HEAD^ 报错

GIT中我们用 git reset --hard HEAD^ 回退到上一个版本HEAD表示当前版本,上一个版本就是HEAD^ ,上上一个版本就是HEAD^^ ,以此类推,但是如果往上版本多的话,比如50个(A同学:我知道,HEAD后面加50个 ^)(手动点赞!)肯定是不需要的,这里我们这样写:HEAD~50 就ok啦但是,如果出现以下这样的报错:不慌不慌,这是因为在命令行程序中, ^ 属于一种特殊字符此时我们只需要用双引号将 ^ 包起来在执行即可 ——> “^”,或者都包起来——>“H

2020-06-18 21:20:56 1094

原创 vscode出现Server is already running from different workspace 报错

我们在vscode中通过 open with live server 运行代码时,有时会出现Server is already running from different workspace 这种服务器无法启动的情况我们只需要在vscode中鼠标右键选择 stop live server ,然后在 通过 live server 运行就ok啦...

2020-06-18 00:15:07 9779 4

原创 jquery实现简单的下拉菜单

本文用简单的几行jquery代码实现简单的下拉菜单效果看效果html<ul> <li> 主题市场 <ul> <li> 运动派 <ul> <li>三级菜单a</li> <li>三级菜单b</li> <li>三级菜单c<

2020-06-17 23:59:42 1170 1

原创 jquery实现手风琴效果

用jquery来实现手风琴效果是非常简单的哦首先来看看效果上代码html<div id="acc"> <ul> <li class="active"> <h3 class="active">红玫瑰</h3> <div><img src="img/bg1.jpg" /></div> </li>

2020-06-15 23:39:03 2641

原创 jquery实现轮播图效果

本文使用jquery实现轮播图效果首先上效果上代码html <div id="main"> <div class="pic"> <ul> <li style="background: url(img/bg1.jpg);"> <img class="img1" src="img/text1.png" /> <img class="img2" src="img

2020-06-15 23:23:47 187

原创 Wamp安装教程

一、Wamp下载Wamp: windows apache mysql php 集成安装环境我用的是Wamp5的版本,安装、操作非常简单附上下载方式:链接:https://pan.baidu.com/s/11X6xTdPQPCObbglVqO4KYg提取码:y3l8二、安装步骤1、安装之前把360之类的杀毒软件全部退出(并不是有毒,因为这些杀毒软件可以会更改Wamp的一些文件,导致安装不成功),点击下一步2、选择安装目录,一般不要太深(安装目录不要有中文)3、安装4

2020-06-15 10:25:30 2600

原创 ES5新增常见方法

Array API数组:2个索引方法:indexOf() 和 lastIndexOf();5个迭代方法:forEach()、map()、filter()、some()、every();2个归并方法:reduce()、reduceRight();String API字符串trim();// 去掉字符串前后空格trimLeft()trimRIght()新增的对象方法JSON.pa...

2020-04-24 21:56:38 156

原创 ES5严格模式

ES5严格模式除了正常运行模式,ECMAscript 5 添加了第二种运行模式:严格模式(strict mode)。顾名思义,这种模式使得Javascript在更严格的条件下运行。严格模式的特点:消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为;消除代码运行的一些不安全之处,保证代码运行的安全;提高编译器效率,增加运行速度;为未来新版本的Javascript做好...

2020-04-23 23:41:59 128

原创 JS基础(三)—变量

变量JavaScript 变量是存储数据值的容器。1.变量声明: var a = "hello world";var声明变量的关键字a变量名=赋值"hello world"变量的值声明变量的时候计算机到底干了什么事呢?我们所写的程序运行在内存中,当我们使用关键字 var 声明一个变量的时候,计算机会从内存中留出一定储存空间,为我们存放不同类型...

2020-04-01 18:23:29 197

原创 JS基础(二)—JS书写

01-JS基础1.JS书写位置js代码结尾的分号可加可不加;script标签可以出现在除title标签以内的其他任何位置;大部分情况写在body结束之前;内部jsscript标签有一个type属性,是可以忽略的:外部js创建一个外部js文件, 用src属性用路径的方式引入js文件:内部引入内联js2.向页面输出内容往页面中写一个字符串(单双引号...

2020-03-31 21:48:21 166

原创 JS基础(一)—JS介绍

01-JS基础1.Javascript是一门面向对象的,跨平台的脚本语言。什么是面向对象?对象:属性和方法什么是跨平台?跨平台特性,在绝大多数浏览器的支持下,可以在多种平台下运行(如Windows、Linux、Mac、Android、iOS等)。什么是脚本语言?HTML文件必须在浏览器里执行。JS文件嵌入到HTML文件里才能执行。凡是不能独立执行需要依赖其他程序的,通常...

2020-03-31 00:24:10 728

原创 响应式布局

响应式布局1.概念响应式布局:用一套代码,去适配不同的设备。既可以运行在PC端,也可以运行在移动端,从而实现响应式布局。就是一个网站能够兼容多个终端,而不是为每个终端做一个特定的版本。这个概念是为解决移动互联网浏览而诞生的。(注:比较适合小网站,个人博客,产品介绍页…)2.CSS3 Media Query要实现响应式布局,我们就需要知道CSS3中的Media Query(媒体查询),Med...

2020-03-26 13:07:38 147

原创 CSS3实现倒影效果

css的功能很强大,可以实现很多效果。比如图像的倒影和文字的倒影等,利用的是box-reflect,因为浏览器兼容问题,目前主要采用-webkit-box-reflect来实现(谷歌浏览器)。倒影的属性:box-reflect:给图片加倒影,只需要给div加一张图片:-webkit-box-reflect: below;下倒影-webkit-box-reflect: abov...

2020-03-25 15:49:03 1136

原创 CSS3文本阴影、边框阴影

1.文本阴影 text-shadow首先来看一个特别酷炫的火焰字:代码:运行效果:这个火焰字就是用文本阴影实现的;text-shadow的属性值:text-shadow:x(阴影在x轴偏移,正值向右偏移,负值向左偏移)y(阴影在y轴偏移,正值向上偏移,负值向下偏移)blur(模糊度,值越大越模糊,不可为负值)color(阴影颜色)多阴影(用逗号隔开)火焰字利用的就是多...

2020-03-25 08:34:41 216

原创 grid网格布局之骰子案例

上次用的flex布局做的骰子,这次用grid网格布局来做。点数1—5用3行3列的网格,点数6用3行2列的网格就ok啦html:css:点数1—5的网格结构都是33的(红框中的结构相同),再利用grid-area找到指定的位置即可点数1:点数2:点数3:点数4:点数5:点数6:32的网格运行结果:...

2020-03-24 09:34:23 566 1

原创 flex布局之骰子案例

此案例用flex布局实现,有利于帮助我们掌握flex语法的使用。首先是1—3的点数,结构相同html:css:运行效果:接下来是点数4,因为flex适合做一维的布局,我们就把点数4的结构分为两行来操作html:css:注: 垂直是主轴的时候:默认情况下,当宽高不写的时候,宽度由父容器决定,高度由内容决定,所以这里我们要给box4下的div 每行50%的高度。运行效果...

2020-03-24 08:39:21 604

原创 flex弹性盒模型

flex弹性盒模型随着移动互联网的发展,对于网页布局来说要求越来越高,而传统的布局方案对于实现特殊布局非常不方便,比如垂直居中。2009年,W3C 提出了一种新的方案----Flex 布局,可以简便、完整、响应式地实现各种页面布局。目前,它已经得到了所有浏览器的支持,这意味着,现在就能很安全地使用这项功能。flex弹性布局比较适合做自适应的网页,特别是移动端(要适配不同大小的设备)一、语...

2020-03-23 21:03:17 201

原创 CSS之元素居中方案

CSS常用的居中方案如图的这种情况,我们要让子元素在父容器内上下左右居中,常用的居中方案有:1、定位 + 拉取自身宽度的一半(这种情况子元素需要固定大小)2、定位 + 位移 : 当子元素大小不固定时,我们要让元素居中可以使用transfom:translate(xx%, xx%); 因为translate的百分比是按照子元素来计算的。此时box2的宽高可不固定,子元素都可以在父容器...

2020-03-21 23:23:02 195

原创 CSS3 pointer-events属性(控制鼠标点击事件)

pointer-events:(鼠标点击事件失效)• 阻止用户的点击动作产生任何效果• 阻止CSS里的 hover 和 active 状态的变化触发事件• 阻止JavaScript点击动作触发的事件• 提交页面,提交按钮点击后,添加这个样式属性(style=“pointer-events”),来防止重复提交。• 一些层的绝对定位,覆盖按钮,穿透可以点击它。pointer-events...

2020-03-21 16:24:12 980

原创 css3 calc()方法详解

css3 calc()方法1、什么是calc()?学习calc()之前,我们有必要先知道calc()是什么?只有知道了他是个什么东西?在实际运用中更好的使用。calc()从字面我们可以把他理解为一个函数function。其实calc是英文单词calculate(计算)的缩写,是css3的一个新增的功能,用来指定元素的长度。比如说,你可以使用calc()给元素的border、margin、pa...

2020-03-20 23:23:04 404

原创 CSS3 iconfont字体图标的使用(很详细)

CSS3 iconfont(字体图标)首先来看看什么是字体图标,在哪里使用?比如天猫的商品分类栏:还有小米商城的底部栏:所以字体图标的使用的是比较多的,而且是很方便更改它的大小以及颜色的,还可以使用彩色的字体图标。首先分享一个非常多字体图标的网站:https://www.iconfont.cn/(阿里巴巴矢量图标库)在这里,基本上你想使用的图标都可以找到,那么接下来我们就看看是...

2020-03-20 21:47:52 11393

原创 HTML5语义化标签

HTML5语义化标签在学习HTML5语义化标签之前,首先来了解一下HTML5的一些相关知识。一、兼容性支持HTML5的浏览器包括Firefox(火狐浏览器),IE9及其更高版本,Chrome(谷歌浏览器),Safari,Opera等;国内的 遨游浏览器(Maxthon),以及基于IE或Chromium(Chrome的工程版或称实验版)所推出的360浏览器、搜狗浏览器、QQ浏览器、猎豹 浏览器...

2020-03-18 13:13:56 383

原创 animation动画

animation动画animation动画1、 首先要知道transition和animation的区别:transition:; 过渡 需要事件触发animation 动画 不需要事件触发,使用关键帧就可以执行2、 animation原理:逐帧动画。会把整个运动过程,划分成100份。3、animation属性:▷ animation-name : ; 设置动画的名字 (自定...

2020-03-16 09:42:36 476

原创 transform变形

transform变形一、定义transform属性应用于元素的2D或3D转换,这个属性可以使元素旋转,缩放,移动,倾斜等。二、属性和用法1、translate : 位移transform:translate(100px,100px); 两个值 分别对应 x轴 和 y轴。transform:translateX(100px);只针对x轴transform:translateY...

2020-03-13 23:00:21 776

原创 transition过渡

transition过渡定义和用法transition用于设置四个过渡属性:1、transition-property : 规定设置过渡效果的CSS属性的名称。all ( 默认值 ) , 指定 width , height;2、transition-duration : 规定完成过渡效果需要多少秒或毫秒。需要添加单位:s (秒) ms (毫秒) 1s == 1000ms3...

2020-03-12 17:42:14 770

原创 CSS Sprite

CSS SpriteCSS Sprite叫做CSS雪碧也叫做CSS精灵,是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去加载。好处(1)可以减少图片的质量,网页的图片加载速度快;(2)减少图片的请求的次数,加快网页的打开;(3)解决网页设计师在图片命名上的困扰,提高了网页制作效率。如图所示:左图中9张图片对服务器的请求次数为9次,右图CSS s...

2020-03-12 09:31:08 173 1

原创 grid网格布局实例

grid网格布局实例一起来学习一下grid网格布局的一个小案例eg:百度风云榜上代码:(1)划分区域按照图示首先划分七个区域:结构:样式:1.划分为3列4行(2)加上网格的间距:(3)找到网格指定的区域:先加上红色的背景色看一下运行效果:(4)分别给每块加上颜色此时每块的背景色就完成了:(5)给对应的块加上文字,再加上样式就完成这个简单的网格布局了...

2020-03-07 22:06:20 500

原创 grid网格布局

grid网格布局Grid布局是一个二维的布局方法,它是由纵横相交的两组网格线形成的框架性布局结构。比如百度风云榜就用到网格布局一、首先来看它的属性:(1)作用在容器上的:display : gridgrid-template-columns : 设置列数grid-template-rows : 设置行数fr单位repeat()方法注:网格中提供了一个新的单位:fr ( 比例单...

2020-03-05 00:11:36 344

原创 语义化标签

语义化标签今天一起来学习HTML5中的语义化标签。首先要了解为什么要使用语义化标签?优点为了在没有CSS的情况下,页面也能呈现出很好地内容结构、代码结构;比div标签有更加丰富的含义,方便开发与维护;方便搜索引擎能识别页面结构,有利于SEO;方便其他设备解析(如移动设备、盲人阅读器等);有利于合作,遵守W3C标准。语义化标签1.HTML5新语义化标签 ( 很重要的 )div ...

2020-03-03 23:57:03 265 1

空空如也

空空如也

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

TA关注的人

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