- 博客(20)
- 收藏
- 关注
转载 移动端点击移除高亮
-webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-user-select: none; user-select:none; -webkit-tap-highlight-color:当用户轻按一个链接或者JavaScript可点击元素时给元素覆盖一个高亮色,值为color,取消高亮可用tr...
2019-03-29 20:56:30 1332
原创 求解设置float之后,各元素之间有缝隙?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> * { padding
2019-02-13 15:25:35 1463
原创 移动端滚动穿透解决方法
当页面中出现弹层时,弹层页面滚动也会引起body的滚动,解决方法如下 // 打开弹层时获取当前页面的滚动值,并给body设置position:fixed;top:当前页面的滚动值 var scrollPx = $('body').scrollTop(); $('body').addClass('openFixed'); $('body').css('top', -scrollPx); //...
2018-09-14 17:04:26 381
原创 移动端兼容之苹果
每日一坑之20180914: <input type="button" value="test" class="disabled" disabled> input 设置 disabled 属性 之后,在ios手机上发现按钮颜色变浅。是因为设置了disabled属性之后,按钮的透明度发生了变化。 解决方法如下 /* 第一种 */ .disabled { ...
2018-09-14 16:52:09 332
原创 select去除默认样式
/*!* option 样式清除 *!*/ option::-ms-expand{ display: none; } option { -moz-appearance:none; /* Firefox */ -webkit-appearance:none; /* Safari 和 Chrome */ appearance:none; padding: 0; width: 20px; display:
2018-04-10 14:41:00 840
转载 移动端开发通用-未认证
1. 阻止旋转屏幕时自动调整字体大小 * { -webkit-text-size-adjust: none; } 2. 修改移动端难看的点击的高亮效果,iOS和安卓下都有效 * { -webkit-tap-highlight-color: rgba(0,0,0,0); } 3. iOS下取消input在输入的时候英文首字母的默认大写 <input type...
2018-04-09 14:43:48 273
原创 css实现文字两端对齐
<div>上海<span></span></div>div { width: 100px; height: 50px; background-color: pink; margin: 0 auto; text-align:justi...
2018-04-02 18:13:39 573
原创 Canvas刮刮乐和灰色图像
下面举一些小例子:先假设的创建一个上下文环境var mycanvas = document.getElementById("mycanvas"); var context = mycanvas.getContext("2d");1. canvas做灰色图像:个人认为主要的知识点在于:获取当前画布中图像的各个像素点的值;灰色图像的求解方式(r+g+b)/3,再将这个值赋给原来的像素的R、G、B;在用...
2018-03-29 12:15:16 444
原创 元素水平垂直居中的五种方式
页面结构为:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>水平垂直居中</title> </head> <body> <div class='content'></div> </body> </html>未知元素宽高的情况下: 1..content{ width: 1
2018-03-14 11:38:42 288
转载 browserHistory和hashHistory的区别
1. browserHistory 其实使用的是 HTML5 的 History API,浏览器提供相应的接口来修改浏览器的历史记录;而 hashHistory 是通过改变地址后面的 hash 来改变浏览器的历史记录;History API 提供了 pushState() 和 replaceState() 方法来增加或替换历史记录。而 hash 没有相应的方法,所以并没有替换历史记录的功能。但 ...
2018-03-09 10:09:08 2784
原创 H5移动端开发相关内容
1、给页面定义最大和最小宽度{ max-width:640px; min-width:320px; }2、去掉a、input标签在浏览器中的默认样式a,button,input,optgroup,select,textarea { -webkit-tap-highlight-color:rgba(0,0,0,0); /*去掉a、input和button点击时的蓝色外边框和灰色
2017-12-05 10:16:55 319
原创 webpack插件
本文章在《webpack入门》基础上进行分享(本文章只做参考,若版本发生变化,分享的代码在运行时会报错,需要自己去文档做相应的修改) 打包之前的文件目录为 1、html-webpack-plugin 打包生成html文件npm install html-webpack-plugin --save-dev //安装使用方法var htmlWebpackPlugin = require('html
2017-10-30 15:08:07 465
原创 webpack入门
一、安装webpack 首先第一步是要安装node哦,没有的小伙伴先去官网 https://nodejs.org/en/ 下载,安装之后在命令行输入node -v 出现node的版本号,就说明你安装成功咯。接下来我们进入正题,安装webpack npm init npm install webpack --save-dev –save-dev 是将webpack 保存进package
2017-10-30 11:17:32 312
原创 前端性能优化
功能强大,使用复杂: http://videojs.com 功能简洁,使用方便: http://flowplayer.org/player/
2017-09-19 18:52:57 402
原创 了解CSS
background <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> div { width: 200px; height: 200px; bo
2017-08-09 14:16:02 261
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人