今天发现一个比较有意思的属性，appearance:none

可能有朋友不认识，但是有一个标签你肯定认识：select。

这个标签的样式是这样的：

一般情况下，我们所使用的border:0; 去除边框这种方式在某些浏览器是对它是不起作用的，比如:Opera 浏览器下就没有作用。

再拿google浏览器举例，虽然有作用，边框可以去除掉，但是右边的倒三角却保留了下来。

比如这样：

如果想要将select的边框和倒三角全部去除掉，这里有两个方法和大家分享一下。

1.可以在select的外部包一个div标签，设置超出隐藏属性，设置好里面select的宽度和高度即可。

2.如果觉得上面的方法比较麻烦，可以使用Css3的一个属性。

appearance:none

-moz-appearance:none /*火狐*/

-webkit-appearance:none /*苹果和谷歌*/

去除select边框和三角-----appearance:none的更多相关文章

  1. H5安卓端浏览器如何去除select的边框？

    H5安卓端浏览器如何去除select的边框? android下没有问题,在apple下无三角号. -webkit-appearance:none; border-radius:0

  2. 去除select下拉框默认样式

    去除select下拉框默认样式 select { /*Chrome和Firefox里面的边框是不一样的,所以复写了一下*/ border: solid 1px #; /*很关键:将默认的select选 ...

  3. table标签去除默认边框

    table去除默认边框 1.在没有出去默认边框时,改变底部颜色,依然显示1px左右的白色边框 2.为table 加上 border="0" cellpadding="0& ...

  4. CSS，点击去除虚线边框代码

  5. jquery去重复 如何去除select控件重复的option

    #1.去除select控件重复的option <select id="companyId" onchange="getContract()" name=& ...

  6. WPF去除窗体边框及白色边框

    <Window x:Class="WpfAppFirst.Evaluation" xmlns="http://schemas.microsoft.com/winfx ...

  7. android 自定义Dialog去除黑色边框

    在自定义Dialog时显示的界面中老是有黑色的边框,下面就介绍使用style去除黑色边框方法. 首先在values/styles定义自定义样式: <style name="MyDial ...

  8. 去除html页面中按钮在ios中的默认样式，去除select自带的小三角图标

    btn{-webkit-appearance: none;} -webkit-appearance: none也能去掉select下拉列表后面自带的小三角

  9. 去除input边框 input去除边框 去除input获取焦点时的蓝色外边框

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. 查看WEB服务器的连接数

    查看WEB服务器的连接数 https://technet.microsoft.com/en-us/sysinternals/bb897437 tcpView

  2. 通过tarball形式安装HBASE Cluster（CDH5.0.2）——重新编译CDH5.0.2 HADOOP点滴

    本文参考博文Hadoop2.2.0遇到64位操作系统平台报错,重新编译Hadoop 由于我采用的tarball方式安装hadoop,其lib/native下根本没有内容,启动hdfs时报这个经典的na ...

  3. GCT之数学公式（平面解析几何）

  4. 使用 SharpSvn 执行 svn 操作的Demo

    1. SharpSvn简介 SharpSvn.dll 是为.Net 2.0-4.0+ 应用提供的 Subversion Client API,更多详细介绍请见 https://sharpsvn.ope ...

  5. vue实现点击关注之后及时更新列表

    如图,我要实现点击关注之后列表及时更新成最新的列表. 思路很简单,主要是两点: 1.在点击关注之后去执行一个请求新的关注列表的action: 2.在vue组件中watch监听已关注列表和推荐关注列表 ...

  6. mongodb 3.2.x 启动 Warning 错误处理

    [root@restore1 data1]# mongod --dbpath=/data/data1/mongodb_data/ --directoryperdb ** WARNING: You ar ...

  7. Lua获取系统时间和时间格式化方法及格式化参数

    一.系统当前时间对应的时间戳 复制代码代码如下: local ntime = os.timeprint(ntime) 二.格式化时间显示,参考下表常用于设置header等 复制代码代码如下: ngx. ...

  8. session没保存，登录失败

    今天发现做的项目,登录不上 查了下原因,原来是session没保存上 查看php.ini文件,session.save_path="D:\php\tmp\tmp" 查看了下对应的目 ...

  9. Android App Crash, send email to author

    http://www.iriphon.com/2011/06/23/how-do-i-get-android-crash-logs/

  10. 解决计算机改名无法连接TFS的问题

    闲着没事改了下计算机名字,结果造成TFS无法连接. 报错讯息如下: ---------------------------Microsoft Visual Studio---------------- ...