css3 不常用但重要的属性

https://www.cnblogs.com/JhoneLee/p/5948886.html

IOS

 

2.-webkit-touch-callout (ios 2.0+)

     none:禁止弹出系统弹窗

     default:默认

Android

 

Common

1.-webkit-user-select

    none：文本不能被选择

    text：可以选择文本

    all：当所有内容作为一个整体时可以被选择。如果双击或者在上下文上点击子元素，那么被选择的部分将是以该子元素向上回溯的最高祖先元素。

    element：可以选择文本，但选择范围受元素边界的约束

2.-webkit-perspective

    number:元素距离视图的距离，以像素计。

    none: 和0效果相同，不设置距离

3.-webkit-perspective-origin

    x-axis:x轴上的位置，默认50%，可能的值：left right center length %

    y-axis:y轴上的位置，默认50%，可能的值：left right center length %

4.-webkit-transform-style

   flat:子元素不保留其3d位置

   preserve-3d：子元素保留其3d位置

5.-webkit-backface-visibilty

  visible:不隐藏transform元素的背面

  hidden:隐藏

6.-webkit-appearance

  用于取消系统默认样式  

  取值地址：http://www.css88.com/webkit/-webkit-appearance/

7.-webkit-input-placeholder

当用户点击iOS的Safari浏览器中的链接或JavaScript的可点击的元素时，覆盖显示的高亮颜色。

color：颜色值

transparent：透明值

8.-webkit-text-size-adjust

none:取消最小12px的限制  放在body中，会阻碍页面缩放。尽量不要设全局

9.-webkit-overflow-scrolling (ios5.0+)

   touch:当手指从触摸屏上移开，会保持一段时间的滚动


   auto:当手指从触摸屏上移开，滚动会立即停止

https://www.cnblogs.com/surfaces/p/6432712.html

移动端 -webkit-user-select:text; ios10 bug 解决方案-----长按复制粘贴功能

<div  style=" margin-top: 100px; background: #888;"><p  style="-webkit-user-select:text !important;line-height: 30px; padding: 10px;  text-align: center; ">1移动端 suface复制文本测试啊  父类没有 -webkit-user-select:text;;</p></div>

以上代码 手机iphone5s 的ios9 没问题，可是换个iphone7 ios10的 出现 无法选中；

后来去掉所有css 样式  js 发现

解决方案

1 去掉body的 -webkit-touch-callout:none;但是不切实际 

2 其他能选文本复制的地方 （下面的）  的文本先手动选择一下。然后再去选择你要选的就可以了；不实际；

3后来发现必须 父元素加个-webkit-user-select:text;才有效，单独子元素即使加-webkit-user-select:text!important也无效

<div  style=" margin-top: 200px; background: #888;-webkit-user-select:text;;"><p  style="-webkit-user-select:text !important;line-height: 30px; padding: 10px;  text-align: center; "> 2移动端 suface  复制文本测试啊 父类 加了-webkit-user-select:text;;</p></div>