HTML5技术

Html 中select标签的边框与右侧倒三角的去除 - 穆迪然

字号+ 作者:H5之家 来源:H5之家 2015-09-24 10:05 我要评论( )

首先是边框的去除:可以设置属性border:none;或border:0px; 不过这还是有一个bug,不同浏览器会在选中select标签时,加上一个边框; 之后是右侧倒三角的去除:设置属性appearance:none; 以下所有属性兼容当前主流浏览器:appearance:none; -moz-appearance:n

首先是边框的去除:可以设置属性border:none;或border:0px;

不过这还是有一个bug,不同浏览器会在选中select标签时,加上一个边框;

之后是右侧倒三角的去除:设置属性 appearance:none; 

以下所有属性兼容当前主流浏览器:appearance:none; -moz-appearance:none; -ms-appearance:none; -o-appearance:none; -webkit-appearance:none;

(不过对与IE浏览器这个属性好像失效!)

以下为IE浏览器和火狐浏览器的显示效果

 

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • HTML5 进阶系列:拖放 API 实现拖放排序 - _林鑫

    HTML5 进阶系列:拖放 API 实现拖放排序 - _林鑫

    2017-05-02 11:02

  • HTML5 进阶系列:indexedDB 数据库 - _林鑫

    HTML5 进阶系列:indexedDB 数据库 - _林鑫

    2017-04-27 14:02

  • HTML5 高级系列:web Storage - _林鑫

    HTML5 高级系列:web Storage - _林鑫

    2017-04-27 14:01

  • 移动前端常用meta标签 - 0jiji0

    移动前端常用meta标签 - 0jiji0

    2017-04-21 12:00

网友点评