笔记&代码段-临时保存下

前端

sticky footer（兼容ie 10） flex教程、flexbox跨浏览器兼容Bug

<style>
 .container{
    display: flex; /*省略浏览器兼容前缀-ms-等，下同*/
    flex-direction: column;
    min-height: 100vh;
 }
 .body{
   flex: 1 0 auto;
  /*
    flex-grow: 1;  flex-grow：默认为0，即如果存在剩余空间，也不放大
    flex-shrink: 0; flex-shrink：属性定义了项目的缩小比例，默认为1，即如果空间不足，该项目将缩小
    flex-basis: auto; flex-basis：默认值为auto，即项目的本来大小
  */
 }
.foot{
   flex-shrink: 0;
 }
</style>
<div class="container">
  <div class="body"></div>
  <div class="foot"></div>
</div>

html 设置

html {
  font-family: "Helvetica Neue", Helvetica, "Microsoft YaHei", Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
  font-size: 125% /*1rem = 20px*/
}

常忘css

background-clip、will-change

元素高度等

网页可见区域宽： document.documentElement.clientWidth;
网页可见区域高： document.documentElement.clientHeight;  
网页正文全文宽： document.documentElement.scrollWidth;
网页正文全文高： document.documentElement.scrollHeight;
网页被卷去的高(ff)：document.body.scrollTop; 
网页被卷去的高(ie): document.documentElement.scrollTop; 
网页被卷去的左：document.body.scrollLeft; 
网页正文部分上：window.screenTop; 
网页正文部分左：window.screenLeft; 
某个元素的宽度：obj.offsetWidth;
某个元素的高度：obj.offsetHeight;
某个元素的上边界到body最顶部的距离：obj.offsetTop;（在元素的包含元素不含滚动条的情况下）
某个元素的左边界到body最左边的距离：obj.offsetLeft;（在元素的包含元素不含滚动条的情况下）
返回当前元素的上边界到它的包含元素的上边界的偏移量：obj.offsetTop（在元素的包含元素含滚动条的情况下）
返回当前元素的左边界到它的包含元素的左边界的偏移量：obj.offsetLeft（在元素的包含元素含滚动条的情况下）
其他
window.getComputedStyle(textNode, null)
object.getBoundingClientRect();

image

展开动画
 overflow: hidden;
 max-height: 0;
 transition: max-height .5s cubic-bezier(0, 1, 0, 1) -.1s;

max-height: 9999px;
transition-timing-function: cubic-bezier(0.5, 0, 1, 0);
 transition-delay: 0s;

vue 相对路径
config/index 
  assetsPublicPath: './'
build/utils
    if (options.extract) {
      return ExtractTextPlugin.extract({
        use: loaders,
        fallback: 'vue-style-loader',
        publicPath: '../../'
      })
    } else {
      return ['vue-style-loader'].concat(loaders)
    }

flex 布局内容被文字撑开，父元素设置 overflow:hideen or width: 0
flex-item 没有省略号，父元素 min-width: 0
vue 覆盖组件样式，打包后失效，将 import App from './App 写在最后参考

模块化导出参考、参考2、参考3

//无依赖
;(function (root, factory) {

    if (typeof define === 'function' && define.amd) {
        define(factory);
    } else if (typeof exports === 'object') {
        module.exports = factory();
    } else {
        root.YourModule = factory();
    }

}(this, function () {
    return {};
}));

// 依赖 jquery
(function (root, factory) {
    if (typeof define === 'function' && define.amd) {
        // AMD
        define(['jquery'], factory);
    } else if (typeof exports === 'object') {
        // Node, CommonJS之类的
        module.exports = factory(require('jquery'));
    } else {
        // 浏览器全局变量(root 即 window)
        root.returnExports = factory(root.jQuery);
    }
}(this, function ($) {
    //    方法
    function myFunc() { };

    //    暴露公共方法
    return myFunc;
}));

正则

 整型或者整型字符串

vue

vue 样式深度选择器

<style scoped>
.test >>> .ep-button {
}
</style>
...
<style lang="less" scoped>
.test /deep/.ep-button {
}
</style>

vue style 里用 assets 图片

<style>
.test-bg {
    background: url(~@/assets/img/bg.png);
}
</style>

vue img 标签里用 assets 图片

  <img src="@/assets/img/logo.png" alt="">

服务器

mongdob 数据库导出导入
- 导出 mongodump -h 127.0.0.1 -d yapi -o ~/outputdata/~
- 导入 mongorestore -d yapi /home/jyh/mongodb/yapi/

JAVA

spring boot
spring boot 安装
 配置tomcat没有artifact

最后编辑于：2019.03.10 00:20:06