虽然 IE6 骂声不断，但是仍然还有不少的市场份额。而在网页中，png 文件体积小、无锯齿、透明度好而被广泛使用。当这两件事情碰在一起，问题就来了，IE6 不支持 PNG 透明图片，它会把透明的部分显示成白色的。
本文效果均使用JS，没有任何TS 我首先找了一个官方示例做例子。 圆角环形饼图：https://echarts.apache.org/examples/zh/editor.html?c=pie-bor
我首先找了一个官方示例做例子。 圆角环形饼图：https://echarts.apache.org/examples/zh/editor.html?c=pie-borderRadius&lang=js
创建一个css文件移动到\themes\butterfly\source\css目录下。
在网页开发过程中，经常会遇到添加背景的的问题，其他的标签都好说，难度比较大的就是给form表单元素添加背景。下面我来给大家介绍一下如何给form表单元素添加背景。
要学好一门技术，最好的方式就是实践。上面这样一个代码图片生成器，就是当初为了学习 React 技术开发，特地找的一个功能不是很复杂，但是涉及的技术点又不至于太单一， 于是找了这样一个工具型的项目（UI 参照 ray.so[2]），代码从零开始实现来检验自己学的知识是否牢固。
最近在做一个比赛项目，在前端设计（使用Vue.js）的时候用到了ElementUI组件。前端整体的背景是深色调，调用ElementUI各项组件时其样式并不能很好的契合主题，因此需要通过CSS修改其色调及样式，但是直接通过class定位组件，并添加!important关键字后依然不能改动。
你是否在使用 Fabric.js 时希望能在选中元素后自定义元素样式或选框（控制角和辅助线）的样式？
用 MozJPEG 压缩 jpeg 1.npm install imagemin-mozjpeg 2.以下内容添加到 imagemin.js 中
HTML5学堂：相对来说，JS在移动端要远远低于PC端的使用频率，因此积累的开发经验并不是太多。在这里简要整理一些JavaScript在移动端的项目经验，主要包括click点击事件延迟、元素高亮点击区、zepto的touch问题等。 移动端click时间300ms延迟 在移动端，click点击事件会造成300ms的延迟，造成这种延迟的原因在于：当用户一次点击屏幕之后，浏览器并不能立刻判断用户是要进行双击缩放，还是想要进行单击操作。因此，浏览器就等待 300 毫秒，以判断用户是否再次点击了屏幕。 对于这种体验
background-clip可以用来控制背景图片／颜色的填充范围。 我们知道，默认的background会填充盒模型的content+padding+border区域内。（可以将border颜色设为透明进行观察）
持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第2天，点击查看活动详情
引入魔改样式的方法很简单，自建一个css文件，然后引入即可。 以butterfly主题为例。可以在[Blogroot]\themes\butterfly\source\css\目录下新建custom.css文件，然后在[Blogroot]\_config.butterfly.yml的inject配置项中引入自定义样式文件。
color : #999999; /*文字颜色*/ font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; /*文字大小*/ font-style:itelic; /*文字斜体*/ font-variant:small-caps; /*小字体*/ letter-spacing : 1pt; /*字间距离*/ line-height : 200%; /*设置行高*/ font-weight:bold; /*文字粗体*/ vertical-align:sub; /*下标字*/ vertical-align:super; /*上标字*/ text-decoration:line-through; /*加删除线*/ text-decoration: overline; /*加顶线*/ text-decoration:underline; /*加下划线*/ text-decoration:none; /*删除链接下划线*/ text-transform : capitalize; /*首字大写*/ text-transform : uppercase; /*英文大写*/ text-transform : lowercase; /*英文小写*/ text-align:right; /*文字右对齐*/ text-align:left; /*文字左对齐*/ text-align:center; /*文字居中对齐*/ text-align:justify; /*文字分散对齐*/ vertical-align属性 vertical-align:top; /*垂直向上对齐*/ vertical-align:bottom; /*垂直向下对齐*/ vertical-align:middle; /*垂直居中对齐*/ vertical-align:text-top; /*文字垂直向上对齐*/ vertical-align:text-bottom; /*文字垂直向下对齐*/ 二、CSS边框空白 padding-top:10px; /*上边框留空白*/ padding-right:10px; /*右边框留空白*/ padding-bottom:10px; /*下边框留空白*/ padding-left:10px; /*左边框留空白 三、CSS符号属性 list-style-type:none; /*不编号*/ list-style-type:decimal; /*阿拉伯数字*/ list-style-type:lower-roman; /*小写罗马数字*/ list-style-type:upper-roman; /*大写罗马数字*/ list-style-type:lower-alpha; /*小写英文字母*/ list-style-type:upper-alpha; /*大写英文字母*/ list-style-type:disc; /*实心圆形符号*/ list-style-type:circle; /*空心圆形符号*/ list-style-type:square; /*实心方形符号*/ list-style-image:url(/dot.gif); /*图片式符号*/ list-style-position: outside; /*凸排*/ list-style-position:inside; /*缩进*/ 四、CSS背景样式 background-color:#F5E2EC; /*背景颜色*/ background:transparent; /*透视背景*/ background-image : url(/image/bg.gif); /*背景图片*/ background-attachment : fixed; /*浮水印固定背景*/ background-repeat : repeat; /*重复排列-网页默认*/ background-repeat : no-repeat; /*不重复排列*/ background-repeat : repeat-x; /*在x轴重复排列*/ background-repeat : repeat-y; /*在y轴重复排列*/ 指定背景位置 background-position : 90% 90%; /*背景图片x与y轴的位置*/ background-position : top; /*向上对齐*/ background-position : buttom; /*向下对齐*/ background-position : left; /*向左对齐*/ background-position : right; /*向右对齐*/ background-position : center; /*居中对齐*/ 五、CSS连接属性 a /*所有超链接*/
Editor.md图片上传获取不到图片地址，Editor.md图片上传iframe存在跨域情况，几经调试都不好用，最后采取替代方案，还不存在跨域情况。
XiunoBBS论坛已经上线了图片水印功能，不过大尺寸图片添加水印会错位或者看不到，这是JS文件默认值限制了； 程序里找到 view/js/xiuno.js 打开，找到1117行、1257行，默认宽度1200px，根据自身情况调整大点即可； xn.upload_file = function(file, upload_url, postdata, complete_callback, progress_callback, thumb_callback) { postdata = postdata || {
提供静态网站托管服务的厂商还是很多的, 上次这个博客还是在阿里云的OSS上面, 虽然oss很便宜但还是没有一种”永久使用权”的归属感, 于是我遇到了Github Pages:
偶然在某思看到这样一个问题，如何使一个div的部分区域变透明而其他部分模糊掉？，最后实现效果是这样的：
以前浏览别的博主网站的时候总会在文章页末看到或多或少一些分享功能，比较常见的都是些社交平台的按钮，当时想的是功能虽好可有多少人会去用啊？心想嘛就是个摆设还不如不要占位置233
一个基于 HTML5 Canvas 绘制的网页背景效果。 Github canvas-nest.js 配置方法 使用 jsDelivr 提供的免费 CDN 服务。 将下面的代码插入到 <body> 和 </body> 标签之间 <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/canvas-nest.js/dist/canvas-nest.js" ></script> 自定义样式 color : 线条颜色, 默认: '0
在Vue.js组件库element-ui中，可以通过调用this.$loading方法来显示一个加载指示器和遮罩层。具体的代码示例如下：
这篇博文用来记录关于hexo的一些魔法操作，主要针对于NEXT主题。将会在未来很长一段时间内持续更新，希望对大家有所帮助。
注意：不兼容IE8及以下，IE11和360的IE兼容模式测试通过====IE8不支持opacity
最近在做产品复盘和技术分享,所以需要做个PPT, 来回顾这半年来的技术贡献. 但苦于mac上运行PPT那感人的流畅度, 成功的激起了我的强迫症, 所以索性想办法通过技术的手段来做个网页版PPT, 这个时候我发现了reveal.js: 一个使用 HTML 语言制作演示文稿的 Web 框架，支持插入多种格式的内容，并以类似 PPT 的形式呈现. 花了15分钟系统的调研了一下, 觉得基本满足技术分享类PPT的要求, 所以决定采用该方案来实现我的网页版PPT. 这里列一下我用的技术调研:
其实一直有人问，怎么修改导航栏的黑色背景，因为这个涉及div框架和class样式表，不是一段代码就能搞定的，今天有时间就把教程整理以下，当然不是一步一步教，因为我并不适合做老师，我只是把成品拿出来，然后把对应的颜色空余出来，至于要什么颜色，自己添加就行了。
本文的目标是和各位工友一起有序的快速上手 p5.js ，会讲解 p5.js 的基础用法。
html基本标签这块儿就不说了，先说body下的文本样式吧： 大盒子box 控制页面渲染，宽度高度撑满浏览器可视区域。通过点击小盒子来切换box 的背景颜色。
Contrast.js插件主要用于检验移动端Web重构还原度，由于大部分设计稿是基于iPhone6以上（1334 x 750）设计的，所以该插件比较适合用iPhone6、iPhone7、iPhone8检查设计还原情况。
这是一个Flash插件，swf是一种动画格式，实现效果应该是下面的Object内容
IE8下设置input的background:none或者background-color:transparent 会导致input框无法选中
网上有不少相关的帖子，不过版本会比较旧，而不同版本可能存在代码不同的问题，不过大部分还是大同小异，本系列就不啰嗦重复了，基本只会按照本人所使用的版本以及个人所使用到的内容来进行介绍。
大家好，关于惊艳的 Hero Header（不知怎么翻译，暂且这么叫吧） 的动效大家见过不少，在页面打开后的瞬间，好的 Hero Header 动效会给用户留下好的印象，如何抓住用户的第一印象呢。从设计角度方面来说，好的 Hero Header 都有以下要素：
最近在做季度总结和技术分享,所以需要做个PPT, 来回顾这半年来的技术贡献. 但苦于mac上运行PPT那感人的流畅度, 成功的激起了笔者的强迫症, 所以索性想办法通过技术的手段来做个网页版PPT, 这个时候笔者发现了reveal.js: 一个使用 HTML 语言制作演示文稿的 Web 框架，支持插入多种格式的内容，并以类似 PPT 的形式呈现. 花了15分钟系统的调研了一下, 觉得基本满足技术分享类PPT的要求, 所以决定采用该方案来实现我的网页版PPT. 这里列一下笔者的技术调研方法论, 供大家参考:
这个红色的大盒子就是#box,我给它添加了一个默认颜色，如果不加就是透明。 我给每个盒子都添加了边框，容易区分块儿与块儿
particles.js用来在 web 中创建炫酷的浮动粒子特效。它调用的粒子动画效果，让网页背景更有科技感。颜色还可以任意切换哦。
总结： 1.优点是去掉了多余的view空和class代码，减少了代码，实现了相同的效果。 2.缺点就是在微信开发者工具中，保存刷新不能获取当前位置scrollTop，只有滚动才能获取scrollTop。
CSS（层叠样式表）是一个强大的工具，可以让开发人员设计出漂亮的网页。在今天这篇本文章中，我们将分享10个 CSS 高级技巧，它们可以将你的网页设计技能提升到一个新的水平。
每个浏览器不同的内核，不同的处理引擎，不同的渲染引擎就会导致写同一条样式的时候出现差异 这个现象叫做做兼容
在任意位置创建一个css文件，例如background.css。（简单来说，就是创建一个txt文件，把名字改为background.css即可。注意扩展名）
图片轮播(淡入淡出)--js原生和jquery实现 图片轮播有很多种方式，这里采用其中的 淡入淡出形式 js原生和jQuery都可以实现，jquery因为封装了很多用法，所以用起来就简单许多，转换成js使用，其实也就是用js原生模拟出这些用法。 但不管怎样，构造一个最基本的表现层是必须的
上那些类似于星座图的点和线，是由vue-particles生成的，不仅自己动，而且能与用户鼠标事件产生互动。 一直中意这种动态插件，今天有时间，迫不及待试了一波~
看见本站动态背景了吗？它就是基于Canvas技术实现的。 Canvas 是 HTML5 中一个新特性，开发者绘制一系列图形。通过和JavaScript配合，可以使静态的图形动起来~
代码取自开源项目50projects50days，用作个人学习和巩固三件套的知识，增加了注释，可能会有小改动。
JsChart是什么？ JSChart能够在网页上生成图标，常用于统计信息，十分好用的一个JS组件。 使用JsChart 一。导入jscharts.js 二。编写jscharts.jsp测试页面 1.下载JScharts库 从官网下载JScharts库，我们使用的是压缩包里面的jscharts.js文件。它大约150KB。 使用JScharts库 在网页文件（如.html或.jsp）包含JScharts库。 <script type="text/javascript" src="js/jscharts.js
首先看一下这篇文章： https://blog.csdn.net/MPFLY/article/details/78134980
我的旧主题是基于初学前端时写的 Fuji 主题构建的大改版，而在历经多次小修小补之后终于进入了维护不动的的状态。无论是 Hugo 模板本身，还是相配的 JS 和 CSS 都进入了完全的混乱状态。趁着近期有一点时间，是时候来一次重构了。
发现，上面这张图是两个美女拼接在一起的，看中间的斜线。 但是呢，刚接到这个需求的时候，开发是抓狂的——第一反应就是用canvas画图，这得多累啊，只是要显示张图片而已，竟然还要动用一坨JS，O__O "… 不过依稀记得，CSS 貌似有个遮罩的特性，可以实现图片的部分显示的效果的。
1. 移动端开发课程概述 移动互联网的兴起，让移动端的开发迅速蹿红。对于前端开发者来说，移动端的开发已经占据了他们大部分工作时间。接下来老马带大家一起学习移动端开发的相关前端开发技术。 这边课程内容包
我们在浏览网页时或者翻转页面时，经常会看到很多精美的效果的效果。其中，抽屉式网页效果比较常见，它主要由图片和文字通过添加js来实现。抽屉式网页通过移动鼠标来实现页面的切换，通过改变文字和图片而展现不同的界面，它非常实用而且实现简单。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM
