CSS3 修改和去除移动端点击事件出现的背景框_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-21 09:09:34
Original
1191 Leute haben es durchsucht

移动端开发的一个很大的好处就是可以不管讨厌的IE浏览器的兼容性,只需要页面在火狐等一些高级浏览器中正常显示就行。
最近在写一些移动端的页面,刚好在今天遇到了这么一个神奇的css特性。那就是tap-highlight-color

这个特效是实现在移动端点击某个地方的时候,比如说按钮或者超链接的时候,系统会默认加上一些灰色的背景和一些高亮的效果。但是有的时候我们并不想要这些效果。并且希望点击的时候实现神不知鬼不觉的感觉,,这个时候就要用到tap-highlight-color了。只需要在点击的元素中加一个css样式即可,如下:
-webkit-tap-highlight-color:rgba(0,0,0,0);

这个样式还可以设置点击时候的背景色:例如:

-webkit-tap-highlight-color: rgba(240,240,240,0.7);

则可改变元素被点击时背景框的颜色。

另外还有一个设置选中文字颜色的方法。

通常我们选中文字时的背景色是蓝色。我们可以用以下样式去设置网页的选中内容的样式:

::selection             { background:#FFF; color:#333; }

::-moz-selection    { background:#FFF; color:#333; }

::-webkit-selection { background:#FFF; color:#333;}

如果要去掉选中时的颜色,把background都置为none就行了。

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage