移动端 h5开发相关内容总结——CSS篇

本节内容的由来是在微信上看到了一片文章，关于移动端css的总结，发现了不少新东西。内容在这里

今天尝试用下第五条内容。

5.去掉 a，input 在移动端浏览器中的默认样式

1. 禁止 a 标签背景

在移动端使用 a标签做按钮的时候，点按会出现一个“暗色”的背景，去掉该背景的方法如下：

a,button,input,optgroup,select,textarea {
    -webkit-tap-highlight-color:rgba(0,0,0,0); /*去掉a、input和button点击时的蓝色外边框和灰色半透明背景*/
}

2. 禁止长按 a，img 标签长按出现菜单栏

使用 a标签的时候，移动端长按会出现一个 菜单栏，这个时候禁止呼出菜单栏的方法如下：

a, img {
    -webkit-touch-callout: none; /*禁止长按链接与图片弹出菜单*/
}

3. 流畅滚动

body{
    -webkit-overflow-scrolling:touch;
}

6.CSS 截断字符串

单行截断字符串,这里必须指定字符串的宽度

{
    /*指定字符串的宽度*/
    width:300px;   
    overflow: hidden;  
    /* 当字符串超过规定长度，显示省略符*/ 
    text-overflow:ellipsis;  
    white-space: nowrap;   
}

示例：单行截断字符串,这里必须指定字符串的宽度

注意上边的省略号