css 覆盖元素 style 里面值
譬如覆盖下面的 top<ul class="user-dropdown" style="top:65px">可以使用.user-dropdown{ top: 40px !important; }!important 与优先级无关，但它与最终的结果直接相关，使用一个 !important 规则时，此声明将覆盖任何其他声明。... ...阅读全文
阅读全文
css 实现输入框错误 晃动效果
网上去找个晃动的样式 放到我们 login的 css 文件 style.scss 中:.shake { animation: shake 800ms ease-in-out; } @keyframes shake { 10%, 90% { transform: translate3d(-1px, 0, 0); } ... ...阅读全文
CSS 之 position 相对定位元素 absolute ，relative，fix 等
position 属性规定元素的定位类型。这个属性定义建立元素布局所用的定位机制。任何元素都可以定位：绝对或固定元素会生成一个块级框，而不论该元素本身是什么类型。相对定位元素会相对于它的正常默认位置进行偏移。static 为 默认值1. relative 演示relative 是相对于 正常位置的 偏移。它并不影响附近的元素。<html> <head> <style type="text/css"> * { padding... ...阅读全文
input 输入框 在自动填充时 背景颜色问题
Chrome 浏览器下 form 表单，点击 input 输入框选择输入记录自动填充时，输入框背景颜色会改变，这是 chrome 浏览器内置的表单自动填充背景颜色功能。解决方法input:-internal-autofill-previewed, input:-internal-autofill-selected { // 自动填充时的字体颜色 -webkit-text-fill-color: #fff; // ... ...阅读全文
css 的 box-sizing 布局 如何计算一个元素的总宽度和总高度
CSS 中的 box-sizing 属性定义了 user agent 应该如何计算一个元素的总宽度和总高度。在 CSS 盒子模型的默认定义里，设置一个元素所设置的 width 与 height 只会应用到这个元素的内容区（content-box）。如果再设置这个元素的 border 边框 或 padding 内边距 ，那么这个盒子的实际宽度和高度为： width + border + padding。这样就可能会超出 父盒子1. box-sizing 的设置box-sizing 属性可以被用来调整这些表现:content-box 是 默认值如果你设置一个元素的宽为 100px，那么... ...阅读全文
什么是闭包？ 何时用闭包
通俗的讲，闭包指的是有权访问父作用域的函数，即使在父函数关闭之后。下面我们使用一个计数器实例说明 闭包的使用场景。以下用 js 代码演示1. 使用全局变量；有安全隐患// 初始化计数器 var counter = 0; // 递增计数器的函数 function add() { counter += 1; } // 调用三次 add() add(); add(); add(); // 此时计数器应该是 3任何代码都可以... ...阅读全文
JavaScript 严格模式 Strict_mode 与 非严格模式 的区别
对于 JavaScript 严格模式与非严格模式的区别，强烈建议大家去查看权威文档 MDN: 严格模式。首先，严格模式通过抛出错误来消除一些原有的静默错误。其次，严格模式修复了一些导致JavaScript引擎难以执行优化的缺陷：有时候，相同的代码，严格模式可以比非严格模式下运行的更快。第三，严格模式禁用了在ECMAScript的未来版本中可能会定义的一些语法。1、使用严格模式函数中使用funtion () { 'use strict'; //或者是"use strict";... ...阅读全文
jquery 点击复制 文本
html 按钮<button class="btn btn-info btn-xs copyit" code="{{ 变量 }}" >复制</button> <input id="hide-code" type="text" style='opacity: 0;position: absolute;'>jque... ...阅读全文
jquery.sticky-sidebar.js 一款高性能的 js 固定侧边栏插件
sticky-sidebar 插件 github 地址： https://github.com/abouolia/sticky-sidebar【例子1】 【 例子2】它的特性滚动时，它不会重新计算所有尺寸，而只是重新计算必要的尺寸超级平滑，不会产生滚动滞后或颠簸现象，也不会重排页面。与调整大小传感器集成，以在更改侧边栏或其容器的大小时重新计算插件的所有尺寸。它在每种词缀类型上都有事件触发器，以在特定情况下挂接您的代码。与容器的其余部分相比，如果侧边栏过高或过短，请使用侧栏。零依赖和超级简单的设置。下载引用直接引用下图其... ...阅读全文
linebar js 插件 NProgress 显示顶部进度条效果
效果如下图网站官网：http://ricostacruz.com/nprogress/github：https://github.com/rstacruz/nprogress下载从github下载最新版的 source code引入从下载的代码中，取出 nprogress.css 和 nprogress.js 两个文件，放入你的网站，引入。注意：nprogress.js 要放在 jquery.js 后面调用 <script> $('body').show(); &... ...阅读全文