Zhang Yingji's Blog

斯人若彩虹，遇上方知有

常见的HTTP状态码

状态码的第一位数字表示状态类型 1: 告知请求的处理进度和情况 2: 成功 200: 成功，成功处理了请求 201：已创建，成功并且服务器创建了新的资源 202：已接受，服务器已接受请求，但尚未处理 3: 表示需要进一步操作 301: 永久重定向，常用于域名跳转 302：临时重定向，如未登陆的用户访问用户中心重定向到登录页面 304：未修改，请求的网页...

Posted by zhangyingji on July 26, 2018

常用的水平垂直居中方法

前言 下面分内联元素、块级元素总结 并且强力推荐flex布局 内联元素 单行 // 水平居中 text-align: center; // 垂直居中 height: 100px; line-height: 100px; 多行文字：利用table .parent { display: table; } .children { // 使其成为单元格 di...

Posted by zhangyingji on July 23, 2018

瀑布流布局

思路 固定列数的浮动布局： 根据设备屏幕的宽度和加载图片的宽度来固定列数，之后又获取每一列图片的高度，将要加载的图片放在高度最小的那一列图片下面，循环数组不断的寻找高度最小的那一列图片，将图片放在下面实现基本的布局效果 创建一个滚动条监听事件（当最后一张图片距顶的高度 < 屏幕的高度+滚动条滚动的距离）时，就触发我们在页面动态的添加图片的事件（用JavasSript在Htm...

Posted by zhangyingji on July 22, 2018

前端代码规范

通用规范 语义化、简洁 省略图片、样式、脚本以及其他媒体文件 URL 的协议部分（http:,https:） 注释代码：包含的模块，功能以及优点 HTML 在引用样式表和脚本时，不要指定 type 属性，除非不是 CSS 或 JavaScript 属性值用双引号 CSS font-size: .8em; color: 16进制; 分隔符 -...

Posted by zhangyingji on July 22, 2018

清除浮动、浏览器前缀

清除浮动 给父元素加高度 CSS设置clear:both; 但会导致margin失效 隔墙法 <div class=”cl h10”></div> .cl {clear: both;} // 控制间距 .h10 { height:10px} 给父元素增加overflow:hidden;IE6追加_zoom: 1; 浏览器前缀 ...

Posted by zhangyingji on July 22, 2018

ajax嵌套ajax

问题 项目需要在第一个请求执行成功取得一些参数后，立即执行第二个请求，而用默认参数直接嵌套没有达到想要的的效果 解决 ajax中有一个async参数（异步属性），默认为true。故将其设置为false即可 对异步、同步的不了解的请自行查阅资料

Posted by zhangyingji on July 18, 2018

bootstrap中的模态框和UEditor层次冲突

问题描述 在bootstrap模态框中嵌入了UEditor 点击UEditor的工具栏，发现工具界面在遮罩层之下 解决方法 定位模态框和UEditord工具界面的z-index 在UEditor.config.js文件中，编辑器层级的基数,默认是900（默认被注释） 将其z-index的参数设置大于模态框的z-index即可

Posted by zhangyingji on May 25, 2018

Flex 布局

笔记

前言 采用 Flex 布局的元素，称为flex container。它的所有子元素自动成为容器成员，称为flex item 简单示例： /* 块状元素的flex布局 */ .box{ display: flex; } /* 行内元素的flex布局 */ .box{ display: inline-flex; } 值得注意的是： 设为 Flex 布局以后，子元素的...

Posted by zhangyingji on May 18, 2018

解决button无法触发input类型为file的方法

问题描述 默认input[type=file]样式太丑，做了个美化的button，对其添加click事件后发现只能选择文件，而当点击提交按钮无法真正上传文件 思路 进行伪装，当点击button时实际上点在input[type=file]上 操作 通过CSS，使input[type=file] 位于按钮上层 大小与button相同 opacity设为0，使其透明 H...

Posted by zhangyingji on May 14, 2018

CSS实现表格内容过长时用省略号表示

``` table { /* 列宽由表格宽度和列宽度设定 */ 　　table-layout: fixed; } td { /* 不换行 */ 　　white-space: nowrap; 　　/* 超出单元格的部分隐藏 */ 　　overflow: hidden; 　　/* 用省略号代替被隐藏的部分 */ 　　text-overflow: ellipsis; } ```

Posted by zhangyingji on May 14, 2018

MongoDB集群搭建（分片+副本集）

简述 相关概念 config(配置服务器） 数据和片的对应关系以及相应的配置信息 mongos(路由服务器) 负责把对应的数据请求请求转发到对应的shard服务器上 mongod(分片服务器) 环境准备 windows10 + mongodb3.4 + matlab 3台可以互相ping通的主机(单机下也可以建立不同的文件进行伪分布) 开发...

Posted by zhangyingji on May 12, 2018

项目中babel-cli的使用

项目初始化 npm init 项目中安装babel npm install babel-cli --save-dev 安装相关babel插件 # babel-preset-xxxxxx npm install babel-preset-es2015 --save-dev 改写package.json # src:源目录；lib:目标目录 { "devDependenc...

Posted by zhangyingji on April 14, 2018

FEATURED TAGS
工具 数据库 CSS 前端 JavaScript 网络 安全 框架
ABOUT ME

生活是爱的姿态

FRIENDS