前端css
html+css：一个元素多个类，来抽取相同的属性
如下的图像 其三个box的高度是相同的，且具有浮动元素，因此可以作为一个类来把其属性都放在一起 这种合并其实不难理解，但是我们在整体的代码设计中很难考虑这一点，这个一定要记住！！ .child{ height: 200px; float: left; } <div class="box"> <div ......
流程全局引入外部JS、CSS
全局引入，所有流程 E9如果在代码块里面这样： <script type="text/javascript" src="/js/layui-v2.8.13/layui/layui.js"></script> 是引入不了的。 如果想单独在某个流程引入，如下： ......
html+css：“圣杯布局”的设计案例
一、什么是圣杯布局 圣杯布局：左右两个盒子固定宽度， 中间盒子自适应 二、圣杯布局的设计原则： 我们现在来思考自适应这个问题，其本质就是 left 和 right 覆盖一整个大的center， 然后center使用padding把内容左右留出left和right相应的宽度。 可是，现在如何来覆盖呢？ ......
前端项目搭建的几种方法
方法一：vue-cli 项目搭建 1.首先要安装node.js版本，根据项目需求安装对应版本，下载地址：Index of /docs/https://nodejs.org/docs/ 2.安装vue-cli，打开cmd窗口输入：npm install -g @vue/cli；查看是否安装，打开cmd ......
跑马灯(文字和图片轮播)效果纯css实现
1. 文字和图片连续轮播 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>文字和图片连续轮播</title> <style> * { margin: 0; padding: 0; } body{ text-align: cent ......
html+css：滑动门的设计案例
一、什么是滑动门布局？ 其代码效果如下所示，其不管中间的文字多长，其图片都可以包含进去！！ 二、如何实现滑动门布局？ 首先，我们通过背景图片，通过 <a> <span> 关于我们 </span> <a> 这种来将内容包裹进去。 然后对a进行 background-img 左边，然后对span进行 b ......
现代前端开发的关键库和工具一览
### JavaScript 工具库/函数库 - [Lodash](https://lodash.com/)：Lodash 是一个 JavaScript 实用工具库，提供了许多用于数组、对象、函数等常见操作的函数。 - [Ramda](https://ramdajs.com/)：Ramda 是一个为 ......
前端请求地址含特殊字符"+"后端接收数据显示空格
问题描述： 前端测试Get请求访问，path中的参数含有加号，后端过滤器中使用request.getParameter()方法无法获取。 请求地址：http://localhost:8899/bookmark/getByUser?encryData=g3DGtZnczC7SUm+vRvkaYg== ......
springBoot long类型 长id 到前端丢失精度问题
在Spring Boot中，如果将Long类型的id传递到前端，可能会遇到精度丢失的问题。这是因为JavaScript无法精确地表示大于Number.MAX_SAFE_INTEGER（即9007199254740991）的整数。 为了解决这个问题，你可以采用以下方法之一： 方式1 ： 通过注解方式 ......
html+css：padding与margin的应用场景，以及margin上边框合并问题
一、一个困扰自己长久的问题 padding 和 margin 其似乎可以实现相同的效果，但是纠结使用哪一个。 现在一个规定： 若是内嵌关系，则使用padding来调整，若是并列关系，则使用margin来调整！ 若是内嵌关系，则使用padding来调整，若是并列关系，则使用margin来调整！ 若是内 ......
【校招VIP】前端算法考察之排序
考点介绍 不同的场景中，不同的排序算法执行效率不同;稳定：冒泡、插入、归并;不稳定：选择、快速、堆排序、希尔排序 答案详情解析和文章内容可点击下方链接即可查看 一、考点题目 1.使用js实现数组的快速排序 快速排序使用了冒泡+分治的思路。 每轮从数组中取出一个数作为基准；在排序过程中，小于或等于基准 ......
js_js&css 导入形式
href: <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> <link rel="stylesheet" href="./css/font.css"> <link rel="stylesheet" href=" ......
CSS 自定义checkbox样式
小星星 /**checkbox 样式 begin*/ .chkAuto { width: 10px; height: 10px; } .auto_check input[type="checkbox"] + label::before { content: " "; display: inline- ......
CSS radio自定样式
出来是彩色的 radio button .rdo_enabled { vertical-align: middle; margin-top: 5px; font-size: 25px; transform: scale(2); line-height: 60px; background-color: ......
html+css：<a>中嵌入<img>，实现图片链接
这个很好理解，记住 <a> 中不仅可以写标签，还可以嵌入文字。 现在效果如下，在<a>中嵌入了<img>，同时又嵌入了<p>，点击图片和文字段落，其都会直接来进行跳转。 这个是非常重要的，一点也不难，耐心做下去。 ......
html+css：文章居中，图片居中
我们平常要涉及很多居中，现在这个要理解 一、文字内容居中 如下，其宽度居中采用text-align，但其高度居中，则让块高度，和行高度保持一致，此时就可以实现宽度居中 二、图片居中于浏览器，img作为行内块元素是无法实现的！ img作为行内块元素，其有行的性质，此时 margin 是没有效果的，如下 ......
html+css：padding + content 才是盒子的内容大小
这个要知道，我们有padding，这个padding指的是内容（举个例子，背景颜色就不属于内容）。 我们在计算内容的宽高时要记住，如下图的对比，padding的这个要理解 ......
html+css：深入理解 background-img 和 img区别
这俩 background-img 和 img，在图片布局时，我们经常用到，但我们有时很难理解其区别。 简单来说，background-img，其作为背景，图片大小本身无法决定内容的大小！！ 简单来说，background-img，其作为背景，图片大小本身无法决定内容的大小！！ 简单来说，backg ......
html+css：深入理解“块级元素”、“行内元素”和“行内块”元素
“块级元素”、“行内元素”和“行内块”元素，理解这个，才能深入理解css的盒子模型，这个是非常重要的。 其关键是“宽高”，理解“宽高”，“宽高”，“宽高”！！！ 这个是其根本区别，行内元素是由内容撑开，给宽高不起作用！！ 一、行内元素只记住 span 和 a 元素即可 如下，什么 dd,dt都是块级 ......
前端实现Base64图片压缩
# 背景 对接后端或者第三方的时候，后端或第三方要求前端传递base64编码并要求其大小不能大于5KB。 # 参考文章 - 代码具体见 https://blog.csdn.net/weixin_42752574/article/details/126061352 - 在线base64转图片 http ......
后端导出excel 表格 前端下载
问题描述： 后端导出excel表格为二进制 前端调取接口并下载 方案： 前端将返回数据 设置响应数据类型为blob 封装函数： /** * 后端导出excel方法 * @param postDate 接口传参 * @param interfaceUrl 接口地址 * @param excelName ......
后端代码配置了跨域，前端仍然提示跨域失败
我在go项目中配置了cors中间件，但是前端请求人提示跨域问题，描述如下： The 'Access-Control-Allow-Origin' header contains multiple values 'http://xxxxxx, *', but only one is allowed. 这 ......
开课吧前端1期.阶段2：ES6详解-3 面向对象 JSON
7、 面向对象-基础 //原来写法 function User(name,pass){ //这就是一个类 this.name = name; this.pass = pass; } User.prototype.showName=function(){alert(this.name)}; User. ......
vue3 webpack qiankun微前端
**qiankun: https://qiankun.umijs.org/zh/guide** **demo源码gitee：https://gitee.com/philippines-kisses-snow/qiankun-demo** > 官方对微应用的说明：通常这种场景下微应用是一个不带路由的可 ......
前端常用方法分享, 用户输入钱, 转化成分, 类型判断, 时间格式化
钱转化成分 // 转换成分 function toCent(numStr) { const reg = /(^(?=.*?[1-9].*?)0\.\d+$)|(^[1-9][0-9]*(\.\d{1,2})?$)/ if (!reg.test(numStr)) { throw new Error(' ......
vue使用animate.css
1.在命令行中执行：npm install animate.css --save 2.main.js 中： import animated from 'animate.css' // npm install animate.css --save安装Vue.use(animated) 3.使用 <di ......
css---3d翻转
简单的一个3d翻转的动画特效： <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> .main-img{width: 800px; ......
前端模块化开发技术的发展趋势
说起模块化开发大家想必都不陌生，特别是随着前端应用复杂化，代码呈倍数增长，我们不得不耗费大量的时间去进行管理，模块化也就逐渐的被大家所接受。 ......
【校招VIP】前端算法考察之链表算法
考点介绍： 链表是一种物理存储结构上非连续的数据结构,数据的逻辑顺序是通过链表中的指针链接次序实现相互勾连。链表相对数组而言有很多不同之处,在特定场景下能发挥独特的优势。例如链表的插入和删除操作比数组效率高,数组需要改变其他元素的位置,而链表只需要改变指针的指向。 答案详情解析和文章内容可点击下方链 ......