zoukankan      html  css  js  c++  java
  • 移动WEB前端开发资源整合

    meta相关:

    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="format-detection" content="email=no"/>

    CSS相关:

       -webkit-overflow-scrolling:touch;快速滚动和回弹的效果,看上去和原生app的效率都有得一拼。-webkit-overflow-scrolling创建了带有硬件加速的系统级控件,所以效率很高。但是这相对是耗更多内存的,最好在产生了非常大面积的overflow时才应用。

     移动端字体

    body {font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif; /*使用无衬线字体*/}

     禁止长按链接与图片弹出菜单

    a, img { -webkit-touch-callout: none; }
    防止点击高亮,可以通过给a标签或者body,html加 
    -webkit-tap-highlight-color:transparent;

     -webkit-appearance属性,来改变任何元素的浏览器默认风格

    appearance:none|normal|icon|window|button|menu|field;
    去掉webkit默认的表单样式
    button,input,optgroup,select,textarea {-webkit-appearance:none; }
    禁止选中文本
    -webkit-user-select: none;

     去掉a、input和button点击时的蓝色外边框和灰色半透明背景

    a,button,input,optgroup,select,textarea {-webkit-tap-highlight-color:rgba(0,0,0,0); }

     修改input的planceholder样式

    input::-webkit-input-placeholder {color:#ccc;}

     修改表单获取焦点时的样式

    input[type=text]:focus, input[type=password]:focus { border: 2px solid#f00;outline: none;}

     用CSS实现省略号文字截断

    white-space: nowrap;text-overflow: ellipsis;
  • 相关阅读:
    HTML自学之旅(九)框架
    暑期逛世博 品文化新上海
    重构实践者手记(20130517)
    网页信息抓取DEMO
    正则表达式30分钟入门教程
    变量命名网站
    Thinkpad笔记本电脑进入BIOS不能选择UEFI/Legacy Boot选项
    Useful Expressions Business Correspondence
    DotNetNuke升级中遇到的问题
    DNN端口的问题
  • 原文地址:https://www.cnblogs.com/refe/p/5132804.html
Copyright © 2011-2022 走看看