今天发现一个比较有意思的属性,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. 前端图片压缩(纯js)

    html代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...

  2. Websphere下删除某个文件(ibm-partialapp-delete.props)

    Websphere下删除某个文件(ibm-partialapp-delete.props)

  3. A potentially dangerous Request.Path value was detected from the client异常解决方案

    场景: 当URL中存在“<,>,*,%,&,:,/”特殊字符时,页面会抛出A potentially dangerous Request.Path value was detect ...

  4. jquery获取表单数据方法$.serializeArray()获取不到disabled的值

    $.serializeArray()获取不到disabled的值 经实验,$.serializeArray()获取不到disabled的值,如果想要让input元素变为不可用,可以把input设为re ...

  5. javascript报错集锦

    1.JS 异常之 missing ) after argument list 错误释疑报错原因:不是字符串就输出啦

  6. 【机翻】Deep Plug-and-Play Super-Resolution for Arbitrary

    论文 (PDF) Deep Plug-and-Play Super-Resolution for Arbitrary Blur Kernels https://www.researchgate.net ...

  7. spring+mybatise注解实现

    spring+mybatise注解实现 spring.jpa.database=MYSQL spring.datasource.type=com.alibaba.druid.pool.DruidDat ...

  8. JS有趣的单线程

    一.JS的执行特点    源于单线程的特性, JS在一段时间内只能执行一部分代码, 那么, 当有多块代码需要执行时, 就需要排队等候了.   二.单线程与异步事件 (1) 什么是异步事件?     异 ...

  9. LR 测试http协议xml格式数据接口

    Action() { lr_start_transaction("T1"); web_custom_request("xxxxHTTPRequest", &qu ...

  10. java中的编码和编码格式问题

    看来问的人和回答的人都不一定清楚什么是“编码和编码格式”,以及如何理解“java中字符串的编码”;首先明确几点: unicode是一种“编码”,所谓编码就是一个编号(数字)到字符的一种映射关系,就仅仅 ...