• 全栈工程师必须要掌握的前端Html技能

    作为一名全栈工程师,在日常的工作中,可能更侧重于后端开发,如:C#,Java,SQL ,Python等,对前端的知识则不太精通。在一些比较完善的公司或者项目中,一般会搭配前端工程师,UI工程师等,来弥补后端开发的一些前端经验技能上的不足。但并非所有的项目都会有专职前端工程师,在一些小型项目或者初创……
    2023-11-16 博文
  • CSS 也能实现 if 判断?实现动态高度下的不同样式展现

    最近在群里,有个小伙伴问了这么一道很有趣的问题: CSS 能否实现,容器再某个高度下是某种表现,一旦超出某个高度,则额外展示另外一些内容 为了简化实际效果,我们看这么一张示意效果图: 可以看到,当容器高度没有超过某一个值时,没有箭头图标。反之,箭头图标出现。 这个效果在很多场景都会出现,……
    2023-11-16 博文
  • CSS必学:元素之间的空白与行内块的幽灵空白问题

    作者:WangMin 格言:努力做好自己喜欢的每一件事 CSDN原创文章 博客地址 👉 WangMin 我们在开发的过程中,难免会出现一些难以预料的问题。那么其中,CSS空白现象就是非常常见的问题之一。虽然它已经被发现很久,但仍然有许多新手和经验丰富的开发者们忽略了它对页面布局的影响
    2023-11-16 博文
  • 关于 React 性能优化和数栈产品中的实践

    我们是袋鼠云数栈 UED 团队,致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神,探索前端道路,为社区积累并传播经验价值。 本文作者:的卢 引入 在日常开发过程中,我们会使用很多性能优化的 API,比如像使用 memo、useMemo优化组件或者值,再比如使用 shouldComponent
    2023-11-16 博文
  • CSS色域、色彩空间、CSS Color 4新标准

    引言 近期,三大主流浏览器引擎均发布最新版本,支持W3C的CSS Color 4标准,包含新的取色方法color()和相应语法,可展示更多的色域及色彩空间,这意味着web端能展示更丰富更高清的色彩。虽然目前只有最新版本的现代浏览器才支持,我们可以先提前了解一下这项新标准。 本文首先会先简单介绍几个色
    2023-11-16 博文
  • CSS 还原拉斯维加斯球数字动画

    我的小册 《CSS 技术揭秘与实战通关》上线了,想了解更多有趣、进阶、系统化的 CSS 内容,可以猛击 - LINK。 最近大家刷抖音,是否有刷到拉斯维加斯的新地标 「Sphere」: 场馆内部的视觉效果非常惊人,其中一个效果让我虎躯一震: 我的第一想法就是,这个看起来用 CSS
    2023-11-16 博文
  • 记录--20行js就能实现逐字显示效果???-打字机效果

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 效果演示 横版 竖版 思路分析 可以看到文字是一段一段的并且独占一行,使用段落标签p表示一行 一段文字内,字是一个一个显示的,所以这里每一个字都用一个span标签装起来 每一个字都是从透明到不透明的过渡效果,使用css3的过渡属性tran
    2023-11-16 博文
  • Molecule 在构建工具中的选择

    我们是袋鼠云数栈 UED 团队,致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神,探索前端道路,为社区积累并传播经验价值。 本文作者:修能 朝闻道,夕死可矣 何为 Molecule? 轻量级的 Web IDE UI 框架——Molecule 我们开源了一个轻量的 Web IDE UI 框架
    2023-11-16 教程
  • CSS选择器

    元素选择器 /* 使用元素选择器为所有段落元素应用样式 */ p { color: blue; font-size: 16px; text-align: center; margin: 10px; padding: 5px; background-color: #f0f0f0; } 类选择器 /*
    2023-11-16 教程
  • CSS基础:你必须要知道的行高属性 line-height

    作者:WangMin 格言:努力做好自己喜欢的每一件事 对于初学CSS的同学来说,会有很多属性相关的疑问,行高属性 line-height一定是其中一个,因为它是CSS中非常重要的一个属性,这个属性改变元素在网页中的行高,让你的网页看起来更加整洁,美观。 什么是行高? CSS中的行高(line-he
    2023-11-16 博文
  • 复习css

    复习css 样式 内联样式,行内样式,外部样式优先级 离HTML元素越近,优先级越高 内联样式离元素近:行内样式>内联样式>外部样式 外部样式离元素近:行内样式>外部样式>内敛样式 本质:浏览器从上到下解析过程中,后出现的样式会覆盖较早出现的样式 选择器 基本选择器 id &……
    2023-11-16 教程
  • 记录--仿加入购物车飞入动画效果

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 近期对管理后台相关功能进行优化,其中导出功能涉及到查询数据过多导致查询很慢问题,决定采用点击后加入到下载中心方式,既解决了接口慢等待问题,也方便后期各种文件的重复下载,一举多得~ 功能上很好实现,调接口就可以了,主要涉及到……
    2023-11-16 博文
  • 记录--一个纯样式花里胡哨的动态渐变背景块

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 代码片段 闲来无事写了个有意思的东西,鼠标放在小方块上会放大并挤压周围方块,背景颜色会动态改变。这里没有用一行 js 代码,纯样式(Sass)实现。 <template> <div class="contain
    2023-11-16 博文
  • 记录--谁还没个靠bug才能正常运行的程序

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 最近遇到一个问题,计算滚动距离,滚动比例达到某界定值时,显示mask,很常见吧^ _ ^ 这里讲的不是这个需求的实现,是其中遇到了一个比较有意思的bug,靠这个bug才达到了正确效果,以及这个bug是如何暴露的(很重要)。 下面……
    2023-11-16 博文
  • HTML5前端标签练习

    前端标签 标签的分类 1. 单标签 img br hr <img /> 2. 双标签 a h p div <a></a> 3. 按照标签属性分类 1. 块儿标签 # 自己独自占一行 h1-h6 p div 2. 行内(内联)标签 # 自身文本有多大就占多大 a s
    2023-11-16 博文
  • 从0到1实现 OpenTiny 组件库跨框架技术

    本文分享自华为云社区《从0到1实现 OpenTiny 组件库跨框架技术》,作者:华为云社区精选 。 在华为云《DTSE Tech Talk》技术直播第44期《0基础玩转 OpenTiny 跨框架组件库,实现一站式前端进阶》中,华为云前端开发 DTSE 技术布道师莫春辉老师在本期直播中与开发者一起交流
    2023-11-16 博文
  • 数栈产品中的代码编译器

    我们是袋鼠云数栈 UED 团队,致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神,探索前端道路,为社区积累并传播经验价值。 本文作者:奇铭 前言 目前数栈的多个产品中都支持在线编辑 SQL 来生成对应的任务。比如离线开发产品和实时开发产品。在使用 MonacoEditor 为编辑器的基础上,
    2023-11-16 博文
  • 浏览器渲染原理

    当用户输入网页路径,浏览器首先通过网络请求拿到html字符串,然后经过HTML解析、样式计算、布局、分层、绘制、分块、光栅化、画等过程,将页面的内容最终呈现到了屏幕上。
    2023-11-16 博文
  • 【动画进阶】单标签下多色块随机文字随机颜色动画

    我的小册 《CSS 技术揭秘与实战通关》上线了,想了解更多有趣、进阶、系统化的 CSS 内容,可以猛击 - LINK。 在 CSS 还原拉斯维加斯球数字动画 - 掘金 一文中,我们利用纯 CSS,实现了一个非常 Amazing 的动画效果: 其中一个核心点就是,我们利用了如下的代
    2023-11-16 博文
  • 全栈工程师必须要掌握的前端Html技能

    作为一名全栈工程师,在日常的工作中,可能更侧重于后端开发,如:C#,Java,SQL ,Python等,对前端的知识则不太精通。在一些比较完善的公司或者项目中,一般会搭配前端工程师,UI工程师等,来弥补后端开发的一些前端经验技能上的不足。但并非所有的项目都会有专职前端工程师,在一些小型项目或者初创……
    2023-11-16 博文
  • 内网走nginx代理访问高德webapi2.0

    需求:客户的电脑都只能访问内,服务器可以访问外网,客户电脑使用的项目中用到了高德webapi2.0。10.200.31.45:32100是我们的web服务器。 网上基本上都是对高德webapi1.4的配置方式,而web2.0有一些差别。 1.前端修改高德地图的js应用 如果是index.html引入
    2023-11-16 教程
  • 记录--Vue2屎山之 Table 屎山

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 前言 Vue2 将在 2023 年年底停止维护了,但是 Vue2 的代码却不会在 2023 年消失,还会越来越多;难以想象几十万行或者几百万行的 Vue2 代码迁移到 Vue3,这是不可能办到的; 老一点的前端程序员肯定经历过把大型项目从
    2023-11-16 博文
  • 记录--alova组件使用方法(区别axios)

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 在我们写项目代码时,应该更加专注于业务逻辑的实现,而把定式代码交给js库或工程化自动处理,而我想说的是,请求逻辑其实也是可以继续简化的。 你可能会说,用axios或fetch api就够了啊,哪有什么请求逻辑,那可能是你还没有意识到这个……
    2023-11-16 博文
  • 深入跨域

    跨域这两个字就像一块狗皮膏药一样黏在每一个前端开发者身上,无论你在工作上或者面试中无可避免会遇到这个问题。如果在网上搜索跨域问题,会出现许许多多方案,这些方案有好有坏,但是对于阐述跨域的原理和在什么情况下需要用什么方案,缺少系统性的说明。大家在工作中可能因为大佬们已经配置好了,不……
    2023-11-16 教程
  • 为React Ant-Design Table增加字段设置

    最近做的几个项目经常遇到这样的需求,要在表格上增加一个自定义表格字段设置的功能。就是用户可以自己控制那些列需要展示。在几个项目里都实现了一遍,每个项目的需求又都有点儿不一样,迭代了很多版,所以抽时间把这个功能封装了个组件:@silverage/table-custom,将这些差别都集成了进去,方便今
    2023-11-16 博文
  • 一个常见的 JavaScript 解构陷阱

    在日常的 JavaScript 编码中,我们经常使用解构语法来提取对象中的属性。假设我们有一个名为 fetchResult 的对象,代表从接口返回的数据,其中包含一个字段名为 data。 const fetchResult = { data: null }; 在提取 data 字段时,为了避免接口未
    2023-11-16 教程
  • Vue openAi

    1、提示 由于国内注册 https://api.openai.com 比较麻烦,直接购买的第三方接口和key 淘宝购买,几块钱1个月 3、自己娱乐够用 2、前端框架 Vant 移动端使用 axios 3、创建拦截器,api/request.js /* * @Descripttion: 文件说明 *
    2023-11-16 博文
  • 原生JS实现视频截图

    本文介绍使用canvas的drawImage进行视频截图,并用toDataURL和toBlob转化为图片地址的方法,且重点介绍了将bold信息转化为图片地址的方法。
    2023-11-16 博文
  • 【万字长文】前端性能优化实践

    从一个假死页面引发的思考: 作为前端开发,除了要攻克页面难点,也要有更深的自我目标,性能优化是自我提升中很重要的一环; 在前端开发中,会偶遇到页面假死的现象, 是因为当js有大量计算时,会造成 UI 阻塞,出现界面卡顿、掉帧等情况,严重时会出现页面卡死的情况;
    2023-11-16 教程
  • 浏览器事件循环Event Loop

    事件循环不是浏览器独有的,从字面上看,“循环”可以简单地认为就是重复,比如for循环,就是重复地执行for循环体中的语句,所以事件循环,可以理解为重复地处理事件,那么下一个问题是,处理的是什么事件,事件的相关信息从哪里获取。
    2023-11-16 博文