1.使用CSS穿透覆盖默认样式常见场景：如果我们需要通过input上传文件，type="file"，而这个input的默认样式可以说是非常的丑陋。所以我们希望传一张图片，和输入的一样大，位置在上面一致。这个时候，很明显，这个时候点击图片，输入是不行的。是因为img隔离了点击的穿透，而我们希望的是这个img只是在视觉上屏蔽了input的样式，但是点击的时候还是点击了input。所以，把img做成可穿透的就好了。css代码如下：img{pointer-events:none;}2、实现自定义原生select控件的样式。因为select移动端原生的样式比较丑，但是原生的弹窗效果是符合我们的设计原则的。在直接修改select的样式时，出现了一个奇怪的现象。在chrome调试的时候，自定义样式可以用，在安卓手机上也可以，但是在ios手机上不行。典型的不兼容问题，此时禁用原生样式即可。css代码如下：select{-webkit-appearance:none;}3。文本溢出处理移动设备体积比较小，往往需要省略一些显示的信息。最常见的是单行标题溢出和遗漏，以及多行详细介绍溢出和遗漏。现在都是用框架开发的。这种建议需要形成一个基础组件，方便快捷。css代码如下：//singleline.single{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}//multiplelines.more{display:-webkit-box!important;overflow:hidden;text-overflow:ellipsis;work-break:break-all;-webkit-box-orient:vertical;-webkit-line-clamp:2;//指定行数}4.打开弹性滚动的css代码为如下：body{overflow:scroll;-webkit-overflow-scrolling:touch;}注：Android不支持原生弹性滚动，可以借助第三方库iScroll实现。5、一像素边框设置很多时候，我想在任何设置中都让边框的大小保持在1px，但是因为1px使用的是2dp渲染，也就是说在大小上会显示为2px。因此，使用css3对其进行缩放。css代码如下：.folderli{position:relative;padding:5px;}.folderli+li:before{position:absolute;top:-1px;left:0;content:"";width:100%;height:1px;border-top:1pxsolid#ccc;-webkit-transform:scaleY(0.5);}6.阻止鼠标选择事件
