摘要：
Sass的系统需求 操作系统 - Sass是独立于平台的 浏览器支持 - Sass在Edge/IE（来自IE 8）、Frefox、Chrome、Safari、Opera中工作 编程语言 - Sass基于Ruby Sass官方网站：https://sass-lang.com/ 安装Sass 当我们在命 阅读全文
posted @ 2020-10-13 17:26
酷儿q
阅读(329)
评论(0)
推荐(0)
摘要：
在css3中新增了width的属性值：max-content;min-content和fit-content、fill-availablea，用来实现以内容为主的尺寸计算方式。 分别介绍一下这三个属性的意义： 1.fill-available的意义——自动填满剩余的空间就是有个div没有任何样式的时 阅读全文
posted @ 2020-10-13 17:24
酷儿q
阅读(3116)
评论(0)
推荐(0)
摘要：
Less 提供了css @import css规则的几个扩展，以提供更多的灵活性来处理外部文件。 语法： @import (keyword) "filename"; 以下是导入指令的相关详情： reference，使用较少的文件但不输出。 inline，在输出中包含源文件，但不对其进行处理。 les 阅读全文
posted @ 2020-10-13 17:23
酷儿q
阅读(224)
评论(0)
推荐(0)
摘要：
做渗透测试有一段时间了，发现登录方面的问题特别多，想做个比较全面点的总结，我尽量写的全面点又适合新人，这篇文章可能需要点想象力，因为问题比较多我不可能去海找各种例子举出来，不过好在会上网就遇到过各种登录框，所以大家都比较了解 web登录认证方面，从子功能上可以划分为登录框登录、忘记密码（密码重置）、 阅读全文
posted @ 2020-10-13 17:22
酷儿q
阅读(579)
评论(0)
推荐(0)
摘要：
css3 animation模块，其中animation-timing-function 和 transition-timing-function两个属性来控制动画速度分别提供了ease，liner，ease-in，ease-out，ease-in-out几个预设速度，还可以同过cubic-bezi 阅读全文
posted @ 2020-10-13 17:20
酷儿q
阅读(1666)
评论(0)
推荐(0)
摘要：
前端部署其实也算前端工程化的一部分，这篇博客是我结合实际工作经验和业余探索，总结出的前端部署的一些尝试。一方面自己有所记录，另一方面也能给大家带来些启示。 部署到七牛云 部署到阿里云OSS，部署到腾讯云OSS 部署到腾讯云服务器并使用nginx做反向代理 总结与反思 前提条件： 通过npm run 阅读全文
posted @ 2020-10-13 17:18
酷儿q
阅读(5962)
评论(0)
推荐(0)
摘要：
我们将使用纯css打造一些切换开关并使其拥有类似于checkbox的用户体验。 很多时候我们都需要用户通过勾选/取消checkbox来表明他们对一些问题的答案。我们设置了一个标签，一个checkbox，并在提交表单后获取checkbox值，以查看用户是否已经选中或取消选中该checkbox。我们都知 阅读全文
posted @ 2020-10-13 17:17
酷儿q
阅读(772)
评论(0)
推荐(0)
摘要：
这是一个纯粹利用css所做出来的效果，这个效果说穿了就是一个图像处理的原理，做法跟Photoshop里头的几乎一模一样，只是一个用图层和色版来制作，一个则是用css（把div当成图层思考就好了）。 从PhotoShop开始 一开始我们来玩Photoshop，会比直接写CSS来得容易理解（没有Phot 阅读全文
posted @ 2020-10-13 17:16
酷儿q
阅读(211)
评论(0)
推荐(0)
摘要：
转换任意颜色为RGBA格式 前端编程过程中，经常会遇到要把各种颜色格式（比如 “red”、“#F00”、“#FF0000”等）转换成RGBA格式，搜索网络也可以发现一堆的解决方案： 此处介绍一种方法： 通过canvas的像素获取方法，来获取任意颜色的RGBA数值。大致步骤如下： 首先创建一个尺寸为1 阅读全文
posted @ 2020-10-13 17:15
酷儿q
阅读(212)
评论(0)
推荐(0)
摘要：
嵌套规则 Sass 允许我们将以与html相同的方式嵌套css选择器，将一套 css 样式嵌套进另一套样式中，内层的样式将它外层的选择器作为父选择器，比如： // .scss语法 #main { width: 97%; p, div { font-size: 2em; a { font-weight 阅读全文
posted @ 2020-10-13 17:14
酷儿q
阅读(140)
评论(0)
推荐(0)
摘要：
背景 相信大家在平时的需求当中，都会遇到一些动画需求，那么大家又是如何抉择实现方式呢？这里我大概分为4种情况，gif图/animation/ae导出骨骼动画/ae导出canvas 1. gif图硬核解决 没错！最简单的就是让我们的设计师直接给我们gif图，那么在我们前端看来就是一张图片的问题，只需控 阅读全文
posted @ 2020-10-13 17:12
酷儿q
阅读(206)
评论(0)
推荐(0)
摘要：
<input> type 类型为 file 时使得用户可以选择一个或多个元素以提交表单的方式上传到服务器上，或者通过 JavaScript 的 File API 对文件进行操作 . 常用input属性： accept：指示file类型，没有时表示不限制类型，填入格式后选择文件时只能看见被允许的文件 阅读全文
posted @ 2020-10-13 17:11
酷儿q
阅读(1287)
评论(0)
推荐(0)
摘要：
Node 项目在项目根目录中名为 package.json 的文件中跟踪依赖关系和元数据。这是你项目的核心。它包含名称、描述和版本之类的信息，以及运行、开发以及有选择地将项目发布到 npm 所需的信息。 在本教程中，我们将： 了解 package.json 与项目之间的关系 确定重要字段和元数据 了 阅读全文
posted @ 2020-10-13 17:09
酷儿q
阅读(1056)
评论(0)
推荐(0)
摘要：
浏览器的世界里本没有粘性定位事件。 然而，网页开发中，元素若使用了粘性定位 position:sticky ，常常还需要一个粘性定位事件，比如，外卖菜单。 粘性定位 元素的位置属性（position）设置为 sticky 时，即称为粘性定位。一个元素 <div> 应用了如下 css 声明，那么该元素 阅读全文
posted @ 2020-10-13 17:08
酷儿q
阅读(378)
评论(0)
推荐(0)
摘要：
什么是html语义化 说html语义化就要先说说HTML到底负责的什么？下面摘自维基百科： 超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。HTML元素是构建网站的基石。HTML允许嵌入图像与对象，并且可以用于创建交互式表单 阅读全文
posted @ 2020-10-13 17:06
酷儿q
阅读(159)
评论(0)
推荐(0)
摘要：
box-shaodw 在我们的工作中使用以及越来越多，伴随阴影的动画或多或少都有一点。假设，我们有下面这样一个盒子： div { width: 100px; height: 100px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); } 希望 hover 的时候 阅读全文
posted @ 2020-10-13 17:05
酷儿q
阅读(123)
评论(0)
推荐(0)
摘要：
Web前端就业前景怎么样？整体薪资待遇好不好？近几年IT业可谓是发展火热，而且新出了很多职业。在这众多的新生职业中，备受瞩目的当属Web前端工程师，Web前端在IT行业真正受到重视的时间不超五年，因此众人越来越关心Web前端的发展前景。毕竟学习的目的主要就是为了就业，前端开发工程师的薪资待遇是大家比 阅读全文
posted @ 2020-10-13 17:04
酷儿q
阅读(431)
评论(0)
推荐(0)
摘要：
混合指令（Mixin）用于定义可以重复使用的样式，避免了使用无语意的 class。它可以包含所有的 css 规则，绝大部分 Sass 规则，甚至通过功能引入变量，输出多样化的样式。 混合指令的用法是在 @mixin 后添加名称与样式 。 混合也需要包含选择器和属性，甚至可以用 & 引用父选择器。 / 阅读全文
posted @ 2020-10-13 17:02
酷儿q
阅读(145)
评论(0)
推荐(0)
摘要：
一、使用内容安全策略 完善的内容安全策略(CSP)是前端应用程序安全的基石。CSP是浏览器中引入的一种标准，用于检测和缓解某些类型的代码注入攻击，包括跨站点脚本（XSS）和点击劫持。 <meta http-equiv="Content-Security-Policy" content="defaul 阅读全文
posted @ 2020-10-13 16:55
酷儿q
阅读(262)
评论(0)
推荐(0)
摘要：
为了消除各浏览器对css默认的设置，保持网页在各浏览器中的外观保持一致，初始化css就显得非常必要了！很多时候出现的样式不兼容问题，都可以通过css初始化代码来解决。 1.最耗资源的，最简单的 * { padding: 0; margin: 0; border: 0; } 2.选择性初始化举例（综合 阅读全文
posted @ 2020-10-13 16:53
酷儿q
阅读(344)
评论(0)
推荐(0)
浙公网安备 33010602011771号