敢说敢作敢为, 无怨无恨无悔。这篇文章主要讲述去除select边框和三角-----appearance:none相关的知识,希望能为你提供帮助。
今天发现一个比较有意思的属性,appearance:none
可能有朋友不认识,但是有一个标签你肯定认识:select。
这个标签的样式是这样的:
文章图片
一般情况下,我们所使用的border:0; 去除边框这种方式在某些浏览器是对它是不起作用的,比如:Opera 浏览器下就没有作用。
再拿google浏览器举例,虽然有作用,边框可以去除掉,但是右边的倒三角却保留了下来。
比如这样:
文章图片
如果想要将select的边框和倒三角全部去除掉,这里有两个方法和大家分享一下。
1.可以在select的外部包一个div标签,设置超出隐藏属性,设置好里面select的宽度和高度即可。
【去除select边框和三角-----appearance:none】2.如果觉得上面的方法比较麻烦,可以使用Css3的一个属性。
appearance:none
-moz-appearance:none /*火狐*/
-webkit-appearance:none /*苹果和谷歌*/
推荐阅读
- AndroidStudio关联GitHub
- appium键盘控制目录
- Android1分钟不用改任何代码在Eclipse中使用AAR
- Android开发 retrofit入门讲解
- uni-app开发微信小程序的几天时间
- Appium-实战之启动App 获取信息说明
- Appium的测试简单流程
- PowerShell do-while循环语句
- PowerShell Copy-Item| PowerShell复制文件