摘要：
在使用react的项目中一般都有兼容性问题，特别是使用了组件库比如element-react或者ant-design等等，在ie下多少都会有点小问题，比如样式不正确，或者组件功能失效，甚至白屏等问题。 IE白屏问题 一般情况下，白屏的问题在index.html中引入这两个js就能解决 <!--兼容i 阅读全文
摘要：
页面可见性API——Page Visibility API全屏API——Full Screen 访问摄像头和麦克风——getUserMedia API 电池API——Battery API 预加载——Link Prefetching 监听屏幕旋转变化接口: ——orientationchange 手 阅读全文
摘要：
前言 css中裁剪和遮罩相关的属性一般来说是比较少用到的，但是最近写项目的时候遇到一个问题，要给一张图片上加个白色遮罩，产生合成效果，这就不得不用到css遮罩相关的属性，顺便把裁剪相关属性一起学习来，做个总结，接下来就进入正文 clip-path clip是css中第一个用来裁剪的属性，但是由于新的 阅读全文
摘要：
摘要 JavaScript 和排名前 3 名的 UI 框架将继续继续火热； Svelte 将会继续发展 云计算，服务器端编程和 JAMStack 会不断增长； 预处理和性能优化才是未来； WASM 为Web 带来了很多运算能力； aterial Design、圆角、渐变和深色主题模式是当前的设计趋势 阅读全文
摘要：
浏览器基本的工作流程 进入主话题之前，先罗列一下浏览器的主要构成： 用户界面－ 包括地址栏、后退/前进按钮、书签目录等，也就是你所看到的除了用来显示你所请求页面的主窗口之外的其他部分 浏览器引擎－ 用来查询及操作渲染引擎的接口 渲染引擎－ 用来显示请求的内容，例如，如果请求内容为html，它负责解析 阅读全文
摘要：
“前端框架真的太香了，香到我都不敢徒手撕 DOM 了！” 虽然绝大多数前端er都有这样的困扰，但本着基础为大的原则，手撕 DOM 应当是一个前端攻城狮的必备技能，这正是本文诞生的初衷 —— DOM 并没有那么难搞，如果能去充分利用它，那么你离爱上它就不远了。 三年前我初入前端坑的时候，发现了一个叫做 阅读全文
摘要：
css3新增属性有哪些？来提问这个问题的人都应该知道css3是css的升级版本，那么，css3既然是升级版本，自然是会新增一些属性，接下来本篇文章将给大家介绍关于css3中常用的新增属性。 一、css3新增边框属性 1、css3新增属性之border-color：为边框设置多种颜色 p{ borde 阅读全文
摘要：
输入URL到页面加载发生了什么？通过连接这个过程，然后针对性地对每个过程进行优化，最终实现的就是我们的前端性能优化。本篇文章主要介绍一些基础性的概念，很少涉及真正的性能优化。 具体过程？ 打开浏览器，输入URL，到页面展示出来，这个中间大致经历了这些过程： 输入URL DNS解析 TCP握手 HTT 阅读全文
摘要：
1.video标签 支持firefox自动播放 谷歌、ie不支持自动播放 <video controls="controls" autoplay="autoplay" name="media"><source src="./img/music.mp3" type="audio/mpeg"></vid 阅读全文
摘要：
可能大家都知道，js执行会阻塞DOM树的解析和渲染，那么css加载会阻塞DOM树的解析和渲染吗？接下来，我们就一起来分析一下。 原理解析 那么为什么会出现上面的现象呢？我们从浏览器的渲染过程来解析下。 不同的浏览器使用的内核不同，所以他们的渲染过程也是不一样的。目前主要有两个： webkit渲染过程 阅读全文
摘要：
今天给大家分享的是css3制作的带3d效果的方块，上面简单整理了一下2019年的网红热词。这个DEMO用到了css3的3d变化技巧，做出来的效果还不错。请注意，该3d效果依赖transform-style: preserve-3d属性，必须在现代浏览器或IE11中才能看到效果。 盘他 柠檬精 OMG 阅读全文
摘要：
1、get 在浏览器回退时是无害的，而post会再次提交请求； 2、get 产生的URL地址可以被收藏，而post不可以； 3、get请求会被浏览器主动缓存，而post不会主动缓存，除非手动设置； 4、get请求参数会被完整的保留在浏览器 历史记录中，而post不会； 5、get请求在url中传送的 阅读全文
摘要：
Sass 是一个css预处理程序，至今使用广泛，它之所以流行，是因为它修复了几个css缺陷： Sass 也是 Bootstrap 4 运行的基础。这意味着为了理解如何操作引导代码而学习Sass是非常有帮助的，而不是覆盖代码(这是大多数开发人员的定制方法)。理解Sass可以更好地理解源代码级别的工具。 阅读全文
摘要：
1.去掉无意义的修饰。 嗯，我会瞎说吗？除了内容图片，其他的图片的作用是修饰，也就是对于传达信息来说并非本质性的。最大的优化就是压根不要图片！所以在优化之前要做的，首先是确认设计，设计本身是否需要用那么多图片？还是说可以更简洁？ 2.不用图片。 嗯，切图是一件扯淡的事情！不要隔靴搔痒了少年，直接使用 阅读全文
摘要：
1. 手动分模块 （早期办法 ，这样容易相互覆盖，冗余代码，嵌套过深） 刀耕火种的时代了 2. css预处理（sass/less等） css预处理器最大的好处就是可以支持模块引入，用js的方式来编写CSS，编译之后，终究还是一个文件，因此不可避免的会出现冲突样式 插个题外话：sass vs scss 阅读全文
摘要：
渐变是css3中比较丰富多彩的一个特性，通过渐变我们可以实现许多绚丽的效果。渐变可分为线性渐变和径向渐变。 （1）线性渐变： 沿着某条直线朝一个方向产生渐变效果 语法： linear-gradient([<point> || angle]? <stop>,<stop>[,<stop>]*) 参数说明 阅读全文
摘要：
今天收听网易云音乐时看到孤独星球的特效，于是就顺手搬到这里了。孤独星球特效本身没有什么难点，但如果要加入音轨控制星球运动频率就有点麻烦了，后面我会专门开一篇文章讲解如何使用js去解析mp3的音轨并制作动画特效，这里呢就稍微简单点了，既然是纯css3，星球运动频率就设为固定的好了。 前端代码 html 阅读全文
摘要：
WPF 框架设计为与 DPI 无关，但你依然可能遇到 DPI 问题。尤其是 Image 控件显示的图片会根据图片 EXIF 中的 DPI 信息和屏幕 DPI 自动缩放图片。对于 UI 用图来说这是好事，但对于软件用户随便插入的图片来说就不是了——用户传入的图片可能是各种各样不统一的 DPI。因此这种 阅读全文
摘要：
在线预览 https://jsrun.pro/AafKp/ 如果本文对你有用，对博主小额打赏，以资鼓励，分享更多有用的技能 先看效果： 第一步，实现网格背景： background-image: linear-gradient(0deg, transparent 24%, rgba(32, 255, 阅读全文
摘要：
那么css如何实现高度height随宽度width变化保持比例不变呢？即给定可变宽度的元素，它将确保其高度以响应的方式保持成比例(即，其宽度与高度的比率保持恒定)。 下面以高宽 2:1 为例，通过2种方式来实现这种效果。 方式一：利用定位实现 .wrapper{ position : relativ 阅读全文