前端
文章平均质量分 64
githubcurry
githubcurry
展开
-
前端js--旋转幻灯片
前端js效果--旋转幻灯片原创 2023-08-06 15:02:38 · 409 阅读 · 0 评论 -
前端js--剪刀石头布
前端js效果--剪刀石头布原创 2023-08-06 14:54:35 · 390 阅读 · 0 评论 -
前端页面--视觉差效果
前端视觉差效果,开箱即用原创 2023-08-05 18:30:25 · 417 阅读 · 0 评论 -
前端js--扩展卡片
前端特效详细代码原创 2023-08-05 18:17:49 · 384 阅读 · 0 评论 -
前端页面---滑动分离登录页面
前端页面--滑动分离登录页面原创 2023-08-01 09:52:45 · 204 阅读 · 0 评论 -
前端--健康管理面板
【代码】前端--健康管理面板。原创 2023-07-31 20:18:36 · 327 阅读 · 0 评论 -
前端css--导航栏效果
【代码】前端css--导航栏效果。原创 2023-07-27 11:27:48 · 247 阅读 · 0 评论 -
纯前端实现,点一个链接直接就可以下载服务器里面的图片,不写后端代码
属性,可以实现在前端点击链接直接下载服务器中的图片。如果图片可以通过跨域访问,用户点击链接后浏览器会将其作为下载文件保存到本地设备上。请注意,这种方法只适用于可跨域访问的图片资源。如果所请求的图片存在跨域限制(例如不在同一域名下),浏览器会拒绝下载操作。属性后,浏览器会将链接指向的文件作为下载文件保存到用户的本地设备上。当用户点击该链接时,浏览器会自动下载并保存指定链接的图片。属性来实现点击链接直接下载服务器中的图片。属性设置为图片的 URL,然后添加。在前端中,您可以使用。原创 2023-07-12 10:28:26 · 751 阅读 · 0 评论 -
使用postman等API工具请求接口不会跨域
可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。根据MDNWebDocs里的定义,跨域是指当一个资源从与该资源本身所在的服务器不同的域或端口不同的域或不同的端口请求一个资源时,资源会发起一个跨域HTTP请求。然而,在postman里面,实际上每发出一个请求,都是在独立请求一个资源,而不是在一个网站返回的页面里,再去请求另外一个网站/端口的资源。也就是说,正常的跨域情况,是你访问了一个A网站,然后这个网站返回的资源里面,请求了B网站/端口的资源,于是就跨域了。...原创 2022-08-01 09:17:28 · 3807 阅读 · 0 评论 -
MVC和MVVM
区别:MVC表示“模型-视图-控制器”,MVVM表示“模型-视图-视图模型”;MVVM是由MVC衍生出来的。MVC中,View会直接从Model中读取数据;MVVM各部分的通信是双向的,而MVC各部分通信是单向的;MVVM是真正将页面与数据逻辑分离放到js里去实现,而MVC里面未分离。MVC和MVVM是两种流行的设计模式。其中,MVC表示模型-视图-控制器,MVVM表示模型-视图-视图模型; MVVM是由MVC衍生出。这些设计模式大体上都有助于开发松散组合、易于测试和维护的应用程序。MVC(Mode.原创 2022-03-23 10:20:16 · 5246 阅读 · 1 评论 -
前端嵌入高德地图
操作步骤首先需要去申请一个key,直接在控制台添加就好了,链接页面中合适的位置创建一个div,并有一个id使用上面div的id创建一个map对象,导入相应的js链接和key值,链接图面显示出地图,链接地图上有一些插件可以使用,链接效果图code<!doctype html><html lang="en"><head> <meta charset="utf-8"> <meta http-equiv="X-UA-C原创 2022-03-03 11:33:16 · 3658 阅读 · 0 评论 -
响应式导航栏和响应式底部
使用Semantic UI实现响应式的导航栏和底部区域原创 2022-01-22 21:54:31 · 2058 阅读 · 0 评论 -
什么是npm,什么是npx,他俩有关系吗?
直观理解NPM 的 M 是 Management(管理), NPX 的 X 以理解为 execute(执行)。当执行 npx XXX的时候,npx 先看 XX 在$PATH 里有没有,如果没有,找当前目录的 node_ modules 里有没有,如果还是没有,就安装这个 xxx 来执行。npx也可以理解为少些 package.json 里一个 script 而诞生的。历史说到npm那当然就离不开社区文化,那我们就从社区文化开始说起社区文化的意思是:拥有共同职业或兴趣的人群,自发组织在一起,通过.原创 2021-03-24 19:38:26 · 545 阅读 · 1 评论 -
nodejs低版本升级成高版本
首先查看当前版本node -v然后直接到nodejs的官网下载稳定版的nodejs版本(LTS 长期稳定版本)然后一步步安装就好了!!接下来查看版本就可以看到版本更新了!原创 2021-03-10 15:54:15 · 836 阅读 · 4 评论 -
浏览器渲染解析HTML过程详解(CSS匹配规则为何从右到左!)
浏览器从接收到服务器返回的 HTML 到渲染像素到屏幕上,中间经历了很多的步骤。浏览器初次绘制网页的必经过程称之为“关键渲染路径(Critical Rendering Path,以下称CRP)”。指的是浏览器从请求HTML,CSS,JavaScript 文件开始,到将它们最终以像素输出到屏幕上这一过程。包括以下几个部分:1.构建DOM■将HTML解析成许多Tokens■将Tokens解析成object■将object组合成为一个DOM树2.构建CSSOM■解析CSS文件,并构建出一个CSSOM.原创 2021-03-10 10:43:26 · 947 阅读 · 7 评论 -
web前端的无聊小知识--预加载和懒加载
预加载是指在页面加载完成之前,提前将所需资源下载,之后使用的时候从缓存中调用;懒加载是延迟加载,按照一定的条件或者需求等到满足条件的时候再加载对应的资源预加载增加了服务器压力,换来的是用户体验的提升,典型例子是在一个图片较多的网页中,如果使用了预加载就可以避免网页加载出来是时,图片的位置一片空白(图片可能还没加载出来),造成不好的用户体验;懒加载的作用减少不要的请求,缓解了服务器压力懒加载的原理原理:原理很简单,先把img的src指向空或者一个小图片,图片真实的地址存储在img一个自定义的属性里,&l原创 2020-12-17 13:03:19 · 806 阅读 · 2 评论 -
VScode使用小技巧-如何快速选择一样的元素
我们在使用VScode编辑器的时候,会经常遇到要同时改好多个一样的单词的情况,一个一个的去改,不是要改到猴年马月吗?所以今天来说说如何方便快捷的处理这种情况!这是几种使用多光标的方法:1.上述图中一个一个选择的情况下可以使用command + Dmac本或者windows电脑的control + D2.像这种不均匀分布的情况下,可以按住 alt 键,然后鼠标点击每个想要选中的元素。3.像这种选择一列的情况下,可以按shift+alt,再使用鼠标拖动,也可以出现竖直的列光标,同时可以选中多列。原创 2020-12-02 20:09:06 · 6217 阅读 · 21 评论 -
一个建站小细节-SEO
今天来聊一个无意间发现的小细节,就是在模仿163网页邮箱的登录页面的时候发现了一个很奇怪的事,大家看图:这样一个导航栏的logo图标不就应该是一个a标签包裹着一个img吗?但是并不是我们可以看到里面还有一个p标签并含有一句“163网易邮箱”。当时就很疑惑了,不理解。我就去请教他人和百度,最终得到的答案就是为了方便以后的爬虫爬取数据和SEO(Search Engine Optimization)。爬虫还好,我自己动手爬取过数据,我知道是为什么。但是这个SEO真的是第一次听到。SEO是什么:汉译为.原创 2020-12-01 00:01:22 · 489 阅读 · 16 评论 -
H5属性总结
整理好的常用html的属性:后文附有链接。然后就是安利一款思维导图,可以在网上直接编辑并保存,有很多的模本,拓扑图,思维导图,原型图,uml都可以,还可以多人协作。最后附有思维导图的链接。整理的仅仅是常用的html节点,略有不足,希望各位小伙伴评论区补充思维导图链接:思维导图链接在线图片链接:在线图片链接...原创 2020-11-30 00:01:09 · 370 阅读 · 5 评论 -
网页图片存储格式-SVG
今天来聊聊图片存储的格式-svgSVG是一种图像文件格式,它的英文全称为Scalable Vector Graphics,意思为可缩放的矢量图形。它是基于XML(Extensible Markup Language),由World Wide Web Consortium(W3C)联盟进行开发的。严格来说应该是一种开放标准的矢量图形语言,可让你设计激动人心的、高分辨率的Web图形页面。用户可以直接用代码来描绘图像,可以用任何文字处理工具打开SVG图像,通过改变部分代码来使图像具有交互功能,并可以随时插入到H原创 2020-11-29 11:31:27 · 1417 阅读 · 15 评论 -
你不知道的网站图片存储格式-base64
最近在前端模仿163网易登录界面的时候惊奇的发现:大家先自己想想,这个图片应该怎么设置,很多人就是img就搞定了,后者一个a标签,或者background等等,但是我打开开发者工具后我发现是这样的:我也没太在意,不就是一张网图吗,放到网站服务器上,然后get下来不就好了。但是事情好像不是那么简单。我给大家看看那个资源:data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAR4AAAA+CAMAAADKzIRmAAAAsVBMVEVHcEw3NzfPAyaJi原创 2020-11-29 11:01:08 · 13661 阅读 · 13 评论 -
截图工具和滚动截图
小伙伴们在观看B站up的技术视频的时候,少不了羡慕他们使用的截图工具,就是那种截图之后还可以在截图上面画箭头,做批注。其实这个工具就在我们身边,就是我们每天要用到的QQ在对话框的地方,很好用的,微信也有。但是如果我们需要截取很长的图片的时候呢,这个QQ自带的就很难满足我们的需求,我们总不能一张一张的截取图片吧,下面就是我推荐的滚动截图工具,Xinp,还可以设置图片的存放位置和存放名称,设置快捷键之类的功能都有。滚动截图的时候,先截取你想要图片的宽度,然后点击这里:这样就可以控制鼠标滑轮截取长图了原创 2020-11-28 14:11:09 · 2621 阅读 · 12 评论 -
vscode开发前端常用的插件
vscode是一款常用的前端开发工具,其优点是轻量化的开发工具,本身很小,只有几十M,但是其含有丰富的插件,所以很受前端开发人员的欢迎,下面为大家介绍一些必备的插件:这些都是我平时常用的插件最后安利一个截图工具Xnip,具有滚动截图的作用,有兴趣的小伙伴也可以私聊我如何使用...原创 2020-11-28 13:59:16 · 298 阅读 · 11 评论 -
vscode快速生成一段文字
当我们在写一个前端小demo的时候,会经常用到一个段落里需要用到一些文字先放到哪里,这里就可以有两种方式。一 .下载一个插件,Chinese Lorem,生成简体中文的假文文本并将其插入到Visual Studio Code中,您只需键入jw即可在HTML文件中生成默认的128个简体中文字符。 也可以通过键入jw <字符数>来定义要生成多少个字符。 例如:jw66生成66个字符。 输入触发词汇后按tab或者enter即可产生所需数量的词汇。<p>jw200</p>原创 2020-11-28 13:48:27 · 7424 阅读 · 13 评论 -
vscode快速生成html的基本元素
很简答,就是敲一个!,然后回车,或者根据提示按enter就好了,但是记住一定是英文状态下。原创 2020-11-28 13:37:28 · 688 阅读 · 12 评论 -
浏览器书签栏的小图标设置
大家在浏览网页的时候,在浏览器最上面的书签栏中会有一个小图标,今天就来聊聊怎么设置这个小东西。通过html的一个属性就可以设置成功<link rel="icon" href="img/favicon1.ico">,但是大家可以发现图标都是正方形的,所以我们可以事先将图片修剪为正方形的图片,大小不要求,但是一定要是正方形,而且命名文件为**.ico**结尾的文件,这样就可以设置一个美美的图标了,在别人收藏或者将书签添加到常用的时候就可以看到了!google浏览器书签栏:safari浏览器书原创 2020-11-28 12:09:10 · 4763 阅读 · 15 评论