前端 资料css2 css
css实现一个太极案例
搭建一个太极的盒子 <body> <div></div> </body> 样式（使用 linear-gradient线性渐变；radial-gradient径向渐变） <style> body { background-color: lightcyan; } div { width: 200px; ......
css实现三角形
界面搭建<i></i> 1、右三角形 i { width: 0; height: 0; border: 20px solid transparent; border-left: 20px solid red; } 实现效果： 2、下三角形 i { width: 0; height: 0; borde ......
使用css实现图片轮播功能
功能实现： 先搭建一个用于轮播的容器，水平置入需要轮播的图片，设置图片大小为容器的大小，超出容器的部分隐藏显示 然后用动画使每次需要轮播时让图片向左平移容器的宽度，这样一个简单的轮播就做好了 废话不多说，世界上案例吧 界面搭建 <body> <div class="swiper-container" ......
css中关于超出显示省略号
1、单行超出显示省略号 overflow: hidden; //超出隐藏 text-overflow: ellipsis; //文本超出时显示省略号 white-space: nowrap; //设置文本不换行 2、多行超出显示省略号 overflow: hidden; //超出隐藏 text-ov ......
css笔记
水平布局 这段时间编写静态页面，学习了几种水平布局，其中有不小的差异和注意事项，特此记录汇总一下。 1. display: inline-block 将元素修改为行内块元素，可以在不脱离文档流的情况下实现水平布局，且兼容性极佳。 但是存在元素上下、左右边距不贴合的问题，解决方法如下： 设置父元素fo ......
图片显示（后端返回接口在预览中展示图片，响应无返回）后端返回二进制图片前端乱码解决方案
https://blog.csdn.net/weixin_46801282/article/details/123386264 解决方案一:后端把图片转码成base64再发送过来 router.get('/test', (req, res) => { fs.readFile('./test.png' ......
CSS 媒体查询 @media【详解】
关于媒体查询的一篇好文推荐 https://blog.csdn.net/weixin_41192489/article/details/126028971 ......
Required request body is missing: 前端接口报错错误解决
前几天遇到一个报错：Required request body is missing； 经过检查是因为在传递参数时使用params来传递的。 而使用params来传递参数会被拼接到url上不管是get还是post请求，这时候请求体也就是body是不存在的。 所有后端在获取参数时会报request b ......
拆解前端巨石应用
拆解前端巨石应用 EluxJS-让你像切蛋糕一样拆解前端巨石应用 大家好，EluxJS是一套基于“微模块”和“模型驱动”的跨平台、跨框架『同构方案』，欢迎了解... 可怕的巨石怪 工作中最可怕的是什么？是遇到业务复杂且乱作一团的巨石应用。改一发而动全身，无法渐进式重构，也没人敢对历史包袱进行优化，欠 ......
多线程知识资料记录
一、QT Qthread 1. https://zhuanlan.zhihu.com/p/52612180 2.https://zhuanlan.zhihu.com/p/53270619 3.https://zhuanlan.zhihu.com/p/411764910 ......
前端切图之svg图标的复用基于defs和use 亲测有用
切图网长期致力于web前端开发外包服务，而我们也关注到现在图标很多时候采用svg更多一点，然后图标字体文件已经提供了很多种类的图标，不过采用svg图标可以自行选择更符合、更好看的图标，相比于字体图标更加多样性，而且svg图标加载更快，而当svg的图标被多次使用的时候，我们需要一种类似于变量的定义，然 ......
chatGPT充当前端智能思路助手
替代：百度、谷歌人工搜索 1、我想让你充当前端开发专家。我将提供一些关于Js、Node等前端代码问题的具体信息，而你的工作就是想出为我解决问题的策略。这可能包括建议代码、代码逻辑思路策略。我的第一个请求是“我需要能够动态监听某个元素节点距离当前电脑设备屏幕的左上角的X和Y轴，通过拖拽移动位置浏览器窗 ......
vue打包后前端修改ip地址
1、在static文件夹下新建config.js文件 (function () { window.SITE_CONFIG = {} // 多个地址 window.SITE_CONFIG['baseUrl'] = '请求地址' window.SITE_CONFIG['baseUrl_1'] = '请求 ......
CSS flex布局-解决最后一行元素对齐问题
justify-content对齐问题 在CSS flex布局中，justify-content属性可以控制列表的水平对齐方式，例如space-between值可以实现两端对齐。 但是，如果最后一行的列表的个数不满，则就会出现最后一行没有完全垂直对齐的问题 .container { display: ......
微前端解决方案
微前端已经是一个非常成熟的领域了，但开发者不管采用哪个现有方案，在适配成本、样式隔离、运行性能、页面白屏、子应用通信、子应用保活、多应用激活、vite 框架支持、应用共享等用户核心诉求都或存在问题，或无法提供支持。本文提供一种基于 iframe 的全新微前端方案，完善的解决了这些核心诉求。 将微前端 ......
CSS盒子模型(Box Model)
CSS盒子模型(Box Model) 概念 所有HTML元素可以看作盒子,在CSS中,"box model"这一术语是用来设计和布局时使用 CSS盒子模型本质上是一个盒子,封装周围的HTML元素,它包括: 外边距(margin),边框(border),内边距(padding),和实际内容(conte ......
前端转向PHP进阶之路
一、PHP简介 Hypertext Preprocessor，又称为超文本预处理器（HTML为超文本标签语言），就是我们所说的PHP。它是一种糅杂百家的后台语言，在PHP中，可以见到C、Java等语言的写法和它自创的一些写法，这也就是为什么说学过其他语言的人会比较容易接受PHP。 PHP开发时需要去 ......
前端数据绑定，列表部分数据不显示问题解决 (转)jQuery LigerUI 插件介绍及使用之ligerTree
https://www.cnblogs.com/wanshutao/p/3540664.html https://blog.51cto.com/u_11966318/5375004 突然出现一个列表有几条数据不显示的问题，大部分数据没有问题，只有几条有问题，推测原因应该是数据有问题。 常见数据问题是 ......
CSS01.认识css
1.什么是CSS？ CSS是用于页面展示的语言 CSS决定了页面长什么样子 2.开发者工具 vscode快捷操作 1、快速复制一行 ctrl+c 然后 ctrl+v 2、选定多个相同的单词 双击选定一个单词然后ctrl+d 3、添加多个光标 ctrl+Alt+上箭头（下箭头） 4、全局替换某写单词 ......
CSS02.css构成
为网页添加样式 术语解释 h1 { color:red; background-color: lightblue; text-align: center;} CSS规则 = 选择器（“{”前面的）+ 声明块 声明块 出现在大括号中（{}） 声明块中包含很多声明（属性），每一个声明（属性）表达了某一方 ......
纯 CSS 实现瀑布流式排版
最近写了个页面，想到了用瀑布流实现页面布局。在我看来一个合格的横向瀑布流式布局包含以下几个条件： 1、每个内容块高度可以不等，但宽度相等。 由于内容的不确定性，内容块的高度应根据内容高度伸缩。高度相等的话就变成了网格布局，规整倒是规整，不仅没有瀑布效果，内容的个性也无从体现。 2、内容块应进行横向排 ......
Web前端技术栈（待更新......）
一、HTML 1、什么是HTML 1.1、初识HTML HTML：==Hyper Text Markup Language(超文本标记语言)== 超文本包括：文字、图片、音频、视频、动画等 HTML5的优势 ①世界知名浏览器厂商对HTML5的支持 1、微软 2、Google 3、苹果 ......
记录--前端加载超大图片(100M以上)实现秒开解决方案
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助 前言 前端加载超大图片时，一般可以采取以下措施实现加速： 图片压缩：将图片进行压缩可以大幅减小图片的大小，从而缩短加载时间。压缩图片时需要注意保持图片质量，以免影响图片显示效果。 图片分割：将超大图片分割成多个小图块进行加载，可以避免一次 ......
前端设计模式——状态模式
状态模式（State Pattern）：将对象的行为和状态分离，使得对象可以根据不同的状态来改变自己的行为。在前端开发中，可以使用状态模式来管理页面的状态和响应用户的交互。 在状态模式中，对象的行为取决于其内部状态，当状态发生变化时，对象的行为也会相应地发生改变。这种模式通过将状态抽象为独立的类来实 ......
普通css实现table表格过长数据隐藏，鼠标停留显示全部
在<style></style>中添加下面代码 table { table-layout: fixed; /* 只有定义了表格的布局算法为fixed，下面td的定义才能起作用。 */ } table td { position: relative; /*width: 80px;*/ height: ......
CSS实现跑马灯效果
盒子区域 创建一个大盒子，用来装我们的广告语，还有跑马灯的四个小盒子 <div class="box"> <div></div> <div></div> <div></div> <div></div> 创意广告 </div> 设置box样式 * { padding: 0; margin: 0; } ......
web-lottie 前端动画效果
资源 http://airbnb.io/lottie/#/web lottie 官网 动画的实现逻辑借用官网的一句话 Lottie is a library for Android, iOS, Web, and Windows that parses Adobe After Effects anim ......
css实现霓虹灯特效字体
在开始之前先了解外部字体的引入： vite中字体的引入方法（.otf字体等）如下： 1、在src下的assets文件夹下创建font文件夹，将下载好的字体包放到该文件夹下 2、在font文件夹下创建font.css文件，如果你用的是scss，那么就是font.scss。less同理。 3、在font ......
前端已死？后端已亡？弯弯绕绕，几分真几分假
前端已死，我认为更多的是一种焦虑情绪的表达，市场确实不太好，但这并不是针对前端，是整个互联网行业衰败的表现而已，对此持不同意见的怕是只剩培训机构了吧！毕竟唱衰的永远是打工人，唱兴的都是培训班。打心底讲！如果一个前端，工作3年，只会Vue2/React，看不懂框架报错、看不懂请求异常、连给浏览器打断点... ......